動作サンプル:windowをスクロールして対象が画面内に入ったらclassを変更するjavascript
marginとopacityを変更してみる
お洒落なブランディングサイトなんかでよく見る形を再現してみる。
なんか最近多いですよねこういうの。とりあえずclassを変更するだけだからやっていることは単純です。う~ん書くことが無い・・・ だってただサンプル見せたいだけのページなんですもの。。えっと~、じゃあ関係ないんですが、北海道札幌は今の季節は暖かかったり寒かったり微妙で風邪をひきやすい季節となっております。因みに今はGW。札幌も遂に桜が咲きましたが、北海道で多く見られる桜は「エゾヤマザクラ」という種類の桜で、一般的な「ソメイヨシノ」よりも開花が早い為、札幌の花見の時期は寒い!!油断すると次の日風邪を引くレベル。そんな寒い中で温かい服来て桜見て鼻水垂らしてどおする!!という・・・
すみません。。。書くことなかったもので・・・
詳しくはコチラ
imgでやってみる
アセアセo(^^;o)Ξ(o;^^)oΞo(^^;o)Ξ(o;^^)oドウモ~♪
サンプル sample
サンプル sample
サンプル sample
サンプル sample
サンプル sample
サンプル sample
デフォルトのclassの方にトランジション付けるのは忘れないで下さいね。忘れるとカチッと変わって変ですので(;~〓~) アセアセもいちどimgでやってみる
まとめ
スピードとかはトランジションで各々で変更したほうが良いかと思いますので。。。