DAISO(ダイソー)の採用サイトです。新卒・中途・PA・障がい者採用について掲載しています。
こんにちは、Ryohei(@ityryohei)です! ボックスがスライドインで表示された後、重なり要素(マスク)がスライドアウトするアニメーションのご紹介です。 ページを下にスクロールしていくと、ボックスがスライドインで表示されます。その後、グラデーションの要素がスライドアウトしてコンテンツが表示されるアニメーションになります。 具体的には、下記のデモのような処理となります。 See the Pen Box Slide In Animation | jQuery by ryoy (@intotheprogram) on CodePen. 最近、このタイプのアニメーションが流行しているみたいで、似た表現を取り入れたサイトをよく見かけます。 今回、私なりに「こんな感じで実装しているのかな?」と考えながら、CSSとjQueryでスライドインアニメーションを実装してみました。同様の処理を検討して
簡単に出来るパララックス効果をまとめてみました。 CSSや短いjQueryで出来るものです。 パララックスって、やりたいな~とは思うけど、コンバージョン考えると使えるサイト少ないですよね。 よくあるやつ CSSのcoverで作る、よくあるやつです。 Demo デモはこちら Html <div id="para1"> <div class="first"><p><i>Parallax demo1</i></p></div> <div class="a">a</div> <div class="b">b</div> <div class="c">c</div> <div class="d">d</div> </div>
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く