タグ

関連タグで絞り込む (1)

タグの絞り込みを解除

パララックスに関するkuma56tanのブックマーク (3)

  • jQueryのプラグインが面白い!スクロール時にユーザを引きつけよう

    PCでも、スマートフォンでも、画面をスクロールさせた時の各パーツ等の*「動き・挙動」*というのは、ユーザーの興味を引きつける上で非常に重要な要素です。 最近では動画以外の要素にも動きをつけて表示するホームページが増えてきました。 今回は、ページ下部へとスクロールさせるごとにユニークな動きをする、簡単に設置できるjQueryのプラグインをご紹介します。デモページと併せ、「どんな動きをするか」という具体的な説明もご覧ください。 注目!スクロール時にユーザを引きつけるjQueryプラグイン12選 1. セクションが重なるようにレイヤー表示「StickyStack.js」 配布ページ|デモ 一つひとつのセクションをレイヤーに見立て、ページトップから積み重なるように表示するエフェクト効果を実装できます。垂直に配置した各パネルを上部に固定配置しながら、積み重なるようにスクロールすることができます。言葉

    jQueryのプラグインが面白い!スクロール時にユーザを引きつけよう
  • JavaScriptコードは1行のみ!超手軽にWebサイトでパララックス効果を実現できる「Rellax.js」使ってみた - paiza開発日誌

    どうも、まさとらん(@0310lan)です。 みなさんは、自分のWebサイトに「パララックス効果」を取り入れたいと考えたことはありませんか? 「なんだか難しそう…」とか、「実装が面倒くさい…」のようなイメージをもし持っているのであれば、今回ご紹介するJavaScriptライブラリが一発解消してくれますよ! 【 Rellax.js 】 今回のテーマである「パララックス(視差効果)」がどんなモノであるかは、「Rellax.js」の公式サイトを見ると分かりやすいです。 このように画面を上下に動かす際に、複数のHTML要素が異なるスピードでアニメーションすることで、Webページが立体的になって印象に残りやすいサイトになります。 「Rellax.js」は、このような「パララックス効果」を可能な限り簡単に書けるようにしてくれるJavaScriptライブラリというわけです!(ちなみに、「ver1.0」か

    JavaScriptコードは1行のみ!超手軽にWebサイトでパララックス効果を実現できる「Rellax.js」使ってみた - paiza開発日誌
  • パララックスサイトを制作時に便利よさげなプラグイン「skrollr.js」

    今回は少し触る機会があったのでパララックスを作るときに便利よさげなプラグインをご紹介します。 使用するプラグインは「skrollr.js」 選んだ理由としては… ・軽量 ・スマホでも利用可(スクロールに対応) ・IEも(対応のjsを読みこめば)利用可 ・感覚的に実装できそう ■skrollr.jsを使用したサイト ・http://kataomoi3.com/ ・http://www.larc-en-ciel.com/live2014/ まだ他にもメジャーどころが使ってそうですが。 ■読み込むJS ・jquery(1.9以降?古いと動かないらしいです) ・skrollr.min.js ・skrollr.ie.min.js(IEでも動く用) [プラグインの前に…] とりあえずスクロール量を取得。自分用のメモで書いておきます。 »DEMOを見る //HTML部分 <p id="scrollTxt

  • 1