bringins

JavaScript

コンテンツをかっこいいアニメーションページで魅せるjQueryプラグイン「bringins」

bringinsはWebページ上のコンテンツを、アニメーションページとして表示させるjQueryプラグインです。新たにページを作成するまでもないコンテンツの表示におすすめです。主にテキストを表示させるコンテンツに効果的です。アニメーションはページの左右または中央のうち、どこに表示させるかを指定することが可能です。ページを離れることなく新たなコンテンツをかっこよく魅せれるので、ユーザーのページ離脱を防ぐ効果も期待できますね。

bringins

デモ

  • [デモ1]右表示/幅50%/背景 透過のグレー/マージン50px/closeボタンRGB(102102102)
  • [デモ2]左表示/幅40%/背景グレー/マージン50px/closeボタン白
  • [デモ3]中央表示/幅100%/背景ブラック/マージン50px/closeボタン白

アニメーションの表示部分はスクロール機能を備えており、オプションとしてページの幅・背景色・マージン(余白)・ページの「closeボタン」の配色が指定可能です。CSSは自由に書き換えれるので、あなたの思うままに表現できます。

アニメーションの表示時間は約3秒です。無駄な動きがなく洗練されたアニメーションで表示されるので、ユーザーにストレスを感じさせることなくページの閲覧をしてもらえます。また、同じアニメーションを繰り返し発生させることもできます。

レシポンシブには残念ながら対応していないようなので、PCサイトでの使用がおすすめです。

会員サイトやECサイトなどで、訪問ユーザーへ一時的に何かをお知らせしたい時はありませんか?

そんな時はぜひ、bringinsをチェックしてみてください。例えば、期間限定のキャンペーンやセール情報などです。ページを新たに作成する作業を軽減し、かつ簡単にアニメーションとしてスマートに表示をさせることが可能になります。

bringins

関連記事

  1. JavaScript

    軽量(5KB)で機能も色々あるjQueryのスライダー「MobilySlider」を使ってみる

    軽量なんですが、色々と機能もあるいい感じのjQueryプラグイン「Mo…

  2. JavaScript

    リストのテキストを1つずつ垂直にスライドさせていくjQueryのティッカー「Totem Ticker…

    おもしろいですね、これ。リスト化したli要素を1つずつ垂直方向にスライ…

  3. Trunk.js

    JavaScript

    滑らかなスライド表示がいい!レスポンシブなナビゲーションメニュー「Trunk.js」

    Trunk.jsはレスポンシブに対応したナビゲーションメニューを実装す…

  4. no-image

    JavaScript

    シンプルなイメージスライダーとカルーセルを実装できる「SkySlider」

    SkySliderはシンプルで軽量、そしてレスポンシブにも対応したイメ…

  5. scroll-scope.js

    JavaScript

    親要素の影響を受けずに子要素だけを固定してスクロールさせる「scroll-scope.js」

    scroll-scope.jsは親要素の影響を受けずに子要素だけを固定…

  6. Docked Link jQuery Plugin

最近の記事

  1. 梅しば
  2. BM-IBCDH13RD
  3. 雪
  4. ホットのドリップ
  5. めんたいこ&チーズ味 海老せんべい

アーカイブ

PAGE TOP