「プロとして恥ずかしくないJavaScriptの大原則」のP.79に掲載してある、画像をうねうねさせて表示するサンプルコードについて、動かないっていうコメントをもらったんで、手元のIE6で動いているバージョンを掲載しておきます。
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <style type="text/css"><!-- body { background: #f8dce0; } #img_ { position: absolute; left: 150px; top: 100px; } --></style> <script language="JavaScript"><!-- var rstdv = 60; var rastr = new Array(); var amplt = 10; var frqnc = 2; var ilocx = 20; var ilocy = 20; var protx = 0; var proty = 0; var speed = 1; var rstfq = 0; var rstfl = "anime01.gif"; var ID = "rst"; var hdl = false; function raster() { var img0 = "<img src=\"" + rstfl + "\" id=\"" + ID; var img1 = "\" style=\"POSITION: absolute; DISPLAY: block;\">"; document.write(img0 + "0" + img1); var rstht = document.getElementById(ID+"0").height; var rstwh = document.getElementById(ID+"0").width; if(rstdv > rstht) rstdv = rstht; var piece = rstht / rstdv; rstfq = (frqnc * Math.PI) / rstdv; for (var i = 1; i <= rstdv; i++) { document.write(img0 + i + img1); } pxmax = amplt + Math.sin(Math.PI * 0.5); for (i = 0; i <= rstdv; i++) { rastr[i] = document.getElementById(ID + i); var rctmp = "rect(" + piece * i + " " + rstwh + " " + piece * (i+1) + " 0)"; rastr[i].style.clip = rctmp; protx = amplt * Math.sin(rstfq * i); rastr[i].style.pixelTop = ilocx; rastr[i].style.pixelLeft = ilocy + pxmax - protx; } } function scroll() { var pxmax = amplt * Math.sin(Math.PI * 0.5); proty = (proty % (2 * Math.PI)) + rstfq * speed; for (var i = 0;i <= rstdv; i++) { protx = amplt * Math.sin(rstfq * i + proty); rastr[i].style.pixelLeft = ilocy + pxmax - protx; } } function clickswitch() { if(hdl) { clearInterval(hdl); hdl = false; return; } hdl = setInterval('scroll()', 50); } --></script> </head> <body> <div id="img_"> <script> raster(); </script> </div> <input type="button" name="switch" value="start/stop" onClick="clickswitch()"> </body> </html>