自分なりのヘッダーを作る(クリックで開閉バージョン)
前記事で二回目押すとまたsetTimeoutが作動してしまい
if文が200pxまでの指定しか無いため、ループが続くバグがありました
ボタンのクリックにより値をマイナスしたりプラスしたりする定番のやり方で
修正&開閉可能にしました
少し動き方が雑いように感じますが...
<script type="text/JavaScript"> slide_num = 0; header = 20; function globalheader2(){ if(slide_num == 1){ document.getElementById("globalheader-container").style.height = header+"px"; header--; stoptimer = setTimeout("globalheader2()",1); if(header == 20){stopTimer(); slide_num--;} } else if(slide_num == 0){ document.getElementById("globalheader-container").style.height = header+"px"; header++; stoptimer = setTimeout("globalheader2()",1); if(header == 200){stopTimer(); slide_num++;} } } function stopTimer() { clearTimeout(stoptimer); } </script> <input type="button" onClick="globalheader2()" value="※"> <>/pre>
中に入れる内容はまた考えたいと思います
早いことscriptもstyleのように固定して使えるようにならないかな