ITエンジニア/デザイナ向けにオープンソースを毎日紹介

パララックスエフェクトに代表されるようにスクロールで新しい視覚効果を生み出す試みがされています。単純な上下のスクロールでは得られない大きなインパクトを訪問者に与えることができます。

その新しい手法として紹介したいのがmultiscroll.jsです。スクロールによって起こる新しいエフェクトを楽しんでください。

multiscroll.jsの使い方

何はともあれ動画を見るのが一番分かりやすいかと思います。

いかがでしょう。スクロールすると上下から画像がスクロールしてきて合体します。パララックスとはまた違うインパクトがありますよね。

最初の表示はこんな感じ。
最初の表示はこんな感じ。

スクロールするとコンテンツが上下から表示されてきます。
スクロールするとコンテンツが上下から表示されてきます。

視覚効果は慣れてしまうと思ったインパクトを与えづらくなります。パララックスイフェクトも最近では印象が残りづらくなっているかも知れません。そこで新しい視覚効果を考えてみるのは面白いと思います。ぜひ他にも色々実験してみてください。

multiscroll.jsはJavaScript製、MIT Licenseのオープンソース・ソフトウェアです。

multiscroll.js - split multi-scrolling pages plugin

alvarotrigo/multiscroll.js

 

MOONGIFTの関連記事

コメント

  • MOONGIFTプレミアム
  • Mobile Touch