no-image

JavaScript

オシャレなスクロールエフェクトを実装できる「jQuery Smoove」

jQuery Smooveは、オシャレなスクロールエフェクトを実装することができるjQueryプラグインです。CSS3を使用しているとのこと。ページを下へスクロールした時にコンテンツをエフェクト付きで表示させたい場合に活用したくなりますね。

jQuery Smoove

ABE Media

上記のサイトではページを下へスクロールしていくと、コンテンツがエフェクト付きで表示されます。フェードでフワッと表示されたり、下から起き上がってくるようなエフェクトで表示されたりと、どれもさりげない感じのエフェクトでとてもカッコイイですね。

エフェクトがあることでコンテンツがただ表示されるよりも、よりユーザーに注目してもらえそうですね。サイト全体もどこか優雅な印象になるかと思います。

使い方もシンプルでわかりやすく、またオプションもいろいろあるのでカスタマイズして使いたい人にもピッタリです。

主なオプションは、min_width、min_height、offset、opacity、perspective、transformOrigin、skewY、move、move3d、moveX、moveY、moveZ、rotate、rotate3d、rotateX、rotateY、rotateZ、scale、scale3d、scaleX、scaleY、skew、skewX、skewYです。

というわけで、オシャレなスクロールエフェクトでスムーズにコンテンツを表示できる機能を実装したいという人は、ぜひ「jQuery Smoove」を活用されてみてはいかがでしょうか?

jQuery Smoove

PickeriOSのようなピッカーを実装できるJSライブラリ「Picker」前のページ

シンプルでモダンなさりげない通知システムを実装できる「humane.js」次のページhumane.js

関連記事

  1. Magnific Popup

    JavaScript

    レスポンシブに対応したLightbox風のjQueryプラグイン「Magnific Popup」

    レスポンシブに対応したLightbox風のjQueryプラグイン「Ma…

  2. Shave

    JavaScript

    設定した高さに基づいて複数行のテキストを切り取る「Shave」

    Shaveは設定した最大の高さに基づいてHTML要素内に収まるように複…

  3. Bricklayer

    JavaScript

    軽量なグリッドレイアウトを実装できる「Bricklayer」

    Bricklayerは軽量なグリッドレイアウトを実装することができるラ…

  4. FitText

    JavaScript

    テキストサイズをブラウザ幅の大きさに自動で合わせてくれるjQueryプラグイン「FitText」

    可変するブラウザ幅にテキストサイズを自動で合わせてくれるjQueryプ…

  5. Inspiration for Letter Effects

    JavaScript

    印象的なテキストエフェクトを実装する「Inspiration for Letter Effects」…

    anime.jsを活用した、印象的でとってもかっこいいテキストエフェク…

  6. Emergence.js

    JavaScript

    ブラウザで要素の可視性を検出する「Emergence.js」

    Emergence.jsは、ブラウザで要素の可視性を検出することができ…

最近の記事

  1. EOS R5
  2. Anker PowerExpand Direct 6-in-1 USB-C PDメディアハブ
  3. ペットボトルホルスター

アーカイブ

PAGE TOP