gridscrolling.js

JavaScript

グリッドごとに画面を縦横スクロールできるjQueryプラグイン「gridscrolling.js」

gridscrolling.jsというjQueryプラグインを使えば、縦横に配置されたグリッドごとに画面をスクロールすることができます。HTML5のsectionやasideを使うことで、縦や横にコンテンツが配置されていきます。応用次第で活用できる場面が増えそうですね。

[ads_center]

gridscrolling.js

gridscrolling.js

gridscrolling.js

グリッドマップも表示されるので、現在自分がどこの位置にいるのか把握しやすいですね。他にも上下左右に隣り合っているコンテンツがあれば矢印ナビゲーションも表示できます。

section要素でマークアップされたコンテンツは縦に並んでいき、aside要素は横に並んでいきます。

縦横スクロールすることで画面が切り替わっていきます。1画面はグリッドレイアウトの1部として扱われます。また、矢印キーでも画面を切り替えることが可能です。

1ページ全体をグリッド構造で構築したい時に役立ちますね。

関連記事

  1. Jquery progress indicator on page scroll
  2. Vertical Fixed Navigation #2
  3. JavaScript

    スクロールしても固定表示されてついてくるjQueryプラグイン「Sticky」

    StickyというjQueryプラグインを使えば、スクロールしても固定…

  4. Gradientify

    JavaScript

    シンプルなCSSグラデーション変化を実装できる「Gradientify」

    GradientifyはシンプルなCSSグラデーション変化を実装するこ…

  5. crossfade.js

    JavaScript

    スクロールで画像をクロスフェードできるjQueryプラグイン「crossfade.js」

    crossfade.jsというjQueryプラグインを使えば、スクロー…

  6. Valiant 360

    JavaScript

    360度のパノラマ動画を実装できるビデオプレーヤー「Valiant 360」

    Valiant 360はブラウザ上で360度のパノラマ動画・写真を実装…

最近の記事

  1. ルック セレクション
  2. シルキーウインドモバイル
  3. アリエール パワージェルボール3D
  4. NuAns × Shibaful TAGPLATE

アーカイブ

PAGE TOP