STUDY_html_001_E.html
<html>
<meta charset="utf-8">
<script> すくりぷと </script>
<style> スタイル </style>
<body onLoad="setTimeout('iFlash()',200)">
<img src="STUDY_html_image_001/blink_01.jpg"width="200"height="200"name="ぴかぴか">
<h1 class="ブリンク">ピカピカ<span class="テンメツ">点滅</span></h1>
<blink>ブリンク</blink>
</body>
</html>
<style>
.ブリンク{animation:モジイロ 2s infinite alternate;}
@keyframes モジイロ{20%{color:yellow}
50%{color:blue}
75%{color:green}
100%{color:red}}
.テンメツ{animation:brink 0.5s ease-out infinite alternate;
color:#ff00ff;
font-size:40px;}
@keyframes brink{0%{opacity:1.0;}
100%{opacity:0;}}
body{font-size:100%;}
@keyframes blink{0%{opacity:0}
49%{opacity:0}
50%{opacity:1}}
blink{animation:blink 1s infinite;}
</style>
<script>
vType=["visible","hidden"];
flag=0;
imgName="ぴかぴか";
function iFlash()
{document.images[imgName].style.visibility=vType[flag^=1];
setTimeout('iFlash()',200);}
</script>
sample_STUDY_html_001_E ▶[ blink_01.jpg / sample_STUDY_html_001_E.pdf ]
サンプル・ダウンロード 
