SMINT

メニューをクリックするとスルスルっと縦スクロールしていって、コンテンツの部分でとまるワンページスクロールのサイトを作りたい方にぴったりのjQueryプラグインです。

スクロールさせても、ナビゲーションバーがページの上部に固定されます。

サンプルをご覧下さい。

→ 超絶簡単にワンページスクロールサイトが作れるjQueryプラグイン『Smint』サンプル

ワンページスクロールサイトの人気はまだまだ続いていますね。ワンページスクロールサイトは訪問者にとって迷いにくいデザインです。必要な情報を確実に見て貰いたいという場合には有効です。

一から作ろうとすると意外と手間のかかるナビゲーション付きワンページスクロールサイトですが、このjQueryプラグインを使用すると簡単です。

それでは、設置方法の説明をします。

こちらのサイトから一式ダウンロードしてきましょう。こちらのサイトもこのjQueryプラグインを利用して作ってあるみたいですね。

SMINT is a simple plugin for lovers of one page websites
http://www.outyear.co.uk/smint/

ヘッダー部分にCSSとJSファイルの設定をします。

そして<body>部分にコンテンツを記述します。まずはメニュー部分を作ります。

次にコンテンツ部分を記述します。

これで、ワンページスクロールサイトが作れてしまいます。コンテンツを工夫したり、CSSのスタイルを変更したりしてオリジナルサイトを作ってみましょう。

サンプルのソースを書いておきます。どうぞご参考まで。

この記事と関連してると思われる記事: