CSS3 の transform 属性と JavaScript の SetTimeout メソッドを使って、画像を 360 度連続回転させる小さなプログラムを作成していました。全体を検索することで、必要な結果を得ることができました。プログラムは正常に実行されていますが、1 つのことを理解できません。setTimeout 内で、バックスラッシュの後に一重引用符が必要なのはなぜですか。
setTimeout('rotateAnimation(\'' + elem + '\', '+ speed + ')',speed);
関連する完全なコードは次のとおりです。 head スクリプトの内部:
<script>
var degrees=0;
function rotateAnimation(elem, speed){
var el=document.getElementById(elem);
if(navigator.userAgent.match("Chrome")){
el.style.WebkitTransform="rotate(" +degrees + "deg)";
} else if(navigator.userAgent.match("Mozilla")){
el.style.MozTransform="rotate(" +degrees + "deg)";
}
setTimeout('rotateAnimation(\'' + elem + '\', '+ speed + ')',speed);
degrees++;
if(degrees>359)
degrees=0;
}
</script>
本体内部:
<img id="img1" width="150px" height="150px" src="culture.png" />
<script>
rotateAnimation("img1", 200);
</script>