div要素にして画像もテキストもリンクもまとめてスライドさせる「jQuery Slider2」
高機能過ぎるjQueryスライドショー「Camera slideshow」
ページをめくり効果が美しい。雑誌や本のようにページをめくれるjQueryプラグイン「turn.js」
シンプルなサムネイル画像つきスライダーjQueryプラグイン「AD Gallery」
ルーレット風なものが作れるjQueryプラグイン「Roulette.js 」
クリックすると横からメニューが現れるjQueryプラグイン『Sidr』
レスポンシブでふわっと表示されるドロップダウンメニューを実装する「Responsive Multi-Level Menu」
超絶簡単にワンページスクロールサイトが作れるjQueryプラグイン『Smint』
クリックするとメニューが上から現れる『Top Drawer – A smooth dropdown menu for responsive web design』
ページの背景に画像をフルスクリーンで表示させ、画像の切り替えも可能なjQueryプラグイン「Backstretch」
メニューをクリックするとスルスルっと縦スクロールしていって、コンテンツの部分でとまるワンページスクロールのサイトを作りたい方にぴったりのjQueryプラグインです。
スクロールさせても、ナビゲーションバーがページの上部に固定されます。
サンプルをご覧下さい。
ワンページスクロールサイトの人気はまだまだ続いていますね。ワンページスクロールサイトは訪問者にとって迷いにくいデザインです。必要な情報を確実に見て貰いたいという場合には有効です。
一から作ろうとすると意外と手間のかかるナビゲーション付きワンページスクロールサイトですが、このjQueryプラグインを使用すると簡単です。
それでは、設置方法の説明をします。
最近、パララックス効果（視差効果）を利用したワンページスクロールサイトをよく見かけるようになりました。スクロールすることで画像や文字に動きや演出が加わり印象的なWebサイトを実現しています。
今回はこのパララックス効果を利用したワンページスクロールサイトを比較的簡単に導入できる「skrollr」を紹介します。
サンプルを作ってみました。
エフェクトや背景画像の組み合わせ次第で、とてもお洒落でクールなワンページのスクロールサイトが実現出来ます。
作り方もエフェクトやコンテンツを<div>要素毎に設定するので比較的わかりやすく導入出来ると思います。
１ページのなかで各コンテンツへスクロールさせるデザインのサイト、いわゆる１ページスクロールサイトが最近ポピュラーになってきました。様々なワンページスクロールサイトがありますが、今回はjQueryを使用して、とても簡単にシンプルなワンページサイトを作る方法を紹介します。
サンプルページを作りました。
段落ごとにスクロールさせることができるので、うまく利用すれば印象的なサイトが作れると思います。
作成方法は続きをご覧下さい。
→「jQueryでページの途中へ縦スクロールさせる『Scroll to Internal Link with jQuery』」の続きを読む
ボタンやリンクをクリックすると、隠れていたページが横から現れるページを実装できるjQueryプラグインです。
サンプルページを作ってみましたのでご覧下さい。
セカンドコンテンツには追加情報などの他にも、フォームやメニューを加えたりと利用価値は高そうです。
jQueryプラグイン「PageSlide」の設置方法は続きをどうぞ。
Smooth Vertical or Horizontal Page Scrolling with jQuery
他のサイトと差をつけて、サイトを横スクロールで作成したいときに便利なjQueryプラグインです。印象的かつスムーズに横スクロールします。
まずはサンプルをご覧ください。
→「横スクロールさせたい時の簡単便利なjQueryプラグイン「Smooth Vertical or Horizontal Page Scrolling with jQuery」」の続きを読む
© 2024 ぱんにゃっとTutorial
Theme by Anders Norén — Up ↑