キャプチャ1ページ完結で縦長のスクロールするサイトでよく使われている、スクロールしてもナビゲーションをページ内に残して各コンテンツにスムーススクロールするjQueryプラグイン「smint」というのがシンプルで使い勝手がよさそうだったんですが、ちょっと気になった箇所があったので修正してみました。smintのサイトのデモを見てのとおり、ページをスクロールしてもナビゲーションはページ内に残ってユーザービリティを向上するスクリプトです。スクリプトもシンプルで導入も簡単なんですが、メニューのidをキーにしてリンク先のclassを指定するというのがちょっと使い勝手がわるそうだったので、スタンダード(自分好み?)に各コンテンツ指定したidをキーにメニューからハッシュで飛ばすようにしました。DEMO(改修後:KARA-FULL版)導入方法はほぼ同じでcssとjQueryとsmint.jsを読み込んで、固定配置したいナビゲーションのidに対してsmintを実行させるだけです。it?)の導入方法を参考にして下さい。ハッシュ指定にした以外に、よりシンプルにタグを減らしたり、リサイズにも対応してiOSとAndroidでも表示が崩れないように調整してあります。zipでまとめておいたので気になった方はご自由にダウンロードして下さい。-コメントから要望を頂いたので本家に合わせてコンテンツ位置に合わせてメニューも切り替わるようにしました。(上のDEMOから確認できます)メニューのidに”nav_”+リンク先を指定する事で連携されるようになってます。元のSMINTのメニューとコンテンツとの連携で不具合(ページの一番上からでないと正常動作しないなど)があるので、ちょっと実用には微妙な所です。自分も普段はSMINTを使わずjQueryで直書きしてメニューとナビゲーションの連携にはwaypoint.jsを使っています。自己責任で参考程度に利用して頂けると幸いです。改良版をダウンロードしたい方は以下からダウンロードして下さい。改良版DOWNLOAD時間がある時にでも同機能のをちゃんと作りなおそうかと思います。一年前でもなんでこんな風に?と思う所が結構ありますなぁ。10:06Smintの元のデータはうまく読み込めませんでしたがこちらの改修版を使わせていただいたらできました。ありがとうございました。19:41こちらの「改修後:KARA-FULL版」がシンプルで使い勝手が良さそうだったので、以前作成したページに導入してみました。一日かけてようやくできて喜んでいます!ありがとうございます。ところで、元のSmintにあるような、スクロールしたときに、アクティブ(カレント)ページに対応してナビゲーションメニューが変化するようするにはどうしたらよいでしょうか?元のSmintのjsファイルとこちらの「改修後:KARA-FULL版」を見比べたところ、「.active」クラスを追加して・・・・云々ということは漠然とわかったので、何となく該当箇所らしきところをコピーして貼付けてもうまくいきませんでした。JSは素人のため、詳しく教えていただけると助かります。欲張ってしまってすみません。