タグ

スクロールに関するfree_riderのブックマーク (3)

  • 1ページスクロールがつくれる jQuery Plugin特集【One Page Scroll】 | InfinityScope

    スクロールすると次のコンテンツへとつないでいき、商品やプロダクトなどを印象的にみせてくれる、1ページで完結するタイプのサイトを作成するときに参考にしたいパララックスやフリップ型などのjQuery Pluginを集めました。 1ページスクロールがつくれる jQuery Plugin特集【One Page Scroll】is a post from:InfinityScope 投稿全文を表示する - View All Content Follow Me : FaceBook Page InfinityScope 関連オススメ記事モバイルメニューを実装する多機能 jQuery plugin『mmenu』ページを縦横斜めに、滑らかにスクロールすることが出来るJS,jQueryプラグインから4選「Masonry」のようなPinterest風デザインを実装できる jQuery pluginをいくつかリ

    1ページスクロールがつくれる jQuery Plugin特集【One Page Scroll】 | InfinityScope
  • jQueryで1ページごとにスクロールして画面遷移させるUIを実装する方法|BLACKFLAG

    以前、iPhone5sのプロダクトページがリリースした頃に『簡単にパララックス実装可能な軽量スクリプト「skrollr」&コンテンツごとにページスクロールするjQueryプラグイン「fullPage.js」「One Page Scroll」』と題して1ページをフルスクリーン表示にして、画面全体をスクロールさせることで、1ページ分(1コンテンツ分)を画面遷移させるUIを実装できるjQueryプラグインを紹介しましたが、自分なりにもっと使いやすい形で実現できないかやってみた実験をご紹介してみます。 【2014/08/05 追記】 各ブロック内での横スライド機能を追加しました。 まずは動作サンプルから。 下記のサンプル画面でマウスホイールスクロールもしくは画面右側のナビゲーションボタン等を使って画面(ページ)を切り替えてみてください。 「jQueryで1ページごとにスクロールして画面遷移させるU

    jQueryで1ページごとにスクロールして画面遷移させるUIを実装する方法|BLACKFLAG
  • ある程度スクロールすると横からボタンがアニメーションしながら出現し、ボタンをクリックしページのトップに戻った後、画面横に引っ込むトップへ戻るボタンの実装方法 | ツクログ

    ある程度スクロールすると横からボタンがアニメーションしながら出現し、ボタンをクリックしページのトップに戻った後、画面横に引っ込むトップへ戻るボタンの実装方法 ページトップへスムーズに戻るボタンの解説ですが、今回はアニメーションの仕方が少し変わっています。 このボタンは前回の記事でも解説しましたが、今回解説するものはアニメーションが全く違い、アニメーションの終了時に特徴があります。 始めに完成デモをご覧ください。 完成デモ ある程度スクロールすると、右からボタンが出現しボタンをクリックするとページのトップへ移動し、移動が完了するとボタンが右へ去っていくことが確認できます。 前回の記事との違いはボタンの出現・消滅の仕方であり、前回ではフェードイン・フェードアウトでしたが、今回はanimate関数によるrightプロパティの操作としています。 続いて各ソースコードの確認です。 始めにHTMLです

    ある程度スクロールすると横からボタンがアニメーションしながら出現し、ボタンをクリックしページのトップに戻った後、画面横に引っ込むトップへ戻るボタンの実装方法 | ツクログ
  • 1