[JS]画像やコンテンツを水平・垂直に気持ちよくスクロールさせて表示することにこだわったスクリプト -Sly

Post on:2012年10月31日

sponsors

水平・垂直に配置した画像やコンテンツを気持ちよくスクロールさせることと次に表示するアイテムのロジックにこだわったjQueryのプラグインを紹介します。
IE6にも対応してるのがびっくりです！

Slyの仕組みは、表示される「FRAME」部分とコンテンツを配置する「SLIDEE」部分の二つから構成されています。

特徴は気持ちのいいスクロールだけでなく、ナビゲーションのロジックも直観的で、次に表示するべきアイテムを自動的に先頭に配置します。クリックでアクティブにしたアイテムも常に保持します。

操作は上部のバー、FRAME上でホイール、パネルのクリック、下部のナビゲーションがあり、また下部のボタンでは前・次、最初・最後・中央などの操作もできます。
ナビゲーションでの操作は次に表示するアイテムを先頭に配置します。

デモでは、水平方向のスクロールだけでなく、垂直方向、無限スクロールもあります。

Slyのベーシックな水平方向のデモです。

レイアウトを施したコンテンツも配置できます。

垂直方向ではスマフォのようなレイアウトになっています。

無限スクロールはFRAMEをスクロールし、コンテンツが終わりに近づくと次のコンテンツを読み込み、スクロールが続きます。