Quantcast
Channel: CSSタグが付けられた新着記事 - Qiita
Viewing all articles
Browse latest Browse all 8816

【備忘録】jQueryでアニメーションをつける

$
0
0

jQueryの備忘録

sample.html
<!DOCTYPE html><htmllang="ja"dir="ltr"><head><metacharset="utf-8"><title>sample</title><linkrel="stylesheet"href="style.css"></head><body><aclass="btn"href="#"role="button">ボタン</a><div></div><div></div><div></div><script src="./main.js"></script><script type="text/javascript">$(function(){$('.btn').click(function(){$("div").eq(0).fadeIn('slow');$("div").eq(1).show('slow');$("div").eq(2).slideDown('slow');})});</script></body></html>
style.css
@charset"UTF-8";div{width:200px;height:200px;background:red;display:none;}

【メモ】
・fade,show,slideDownの動きを比較
・eqメソッドを使用することで特定の位置にある要素を指定することができる。


Viewing all articles
Browse latest Browse all 8816

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>