1ページJavaScriptシリーズ 注意喚起したい部分をチカチカと光らせて強調するスクリプト

テクニカルライティングのタスク的には、HTMLヘルプか何かのジョブで、注意書きなどを目立たせるのに使える?

簡単なコードの埋め込みなので、容量も食わないので。

日曜の午後はこんなことをして、もくもくとやっております。

このコードが下の通り。

<!DOCTYPE html>
<body>
<h1>Simple JavaScript animation</h1>
<div id="urgent">
   <h2>Warning<h2>
    <div>
      <ul><li>Do not touch any metal parts of the equipments. If so users might get injured.<li>Read the operation manual before use.</ul>
    </div>
</div>
<script type="text/javascript">
  var e =document.getElementById("urgent");
  e.style.border = "solid black 10px";
  e.style.padding = "30px";
  var colors = ["white", "yellow", "orange", "red"]
  var nextColor=0;

  setInterval(function(){   
      e.style.borderColor=colors[nextColor++%colors.length]; }, 500);
</script>
</body>
</html>
タイトルとURLをコピーしました