この記事では、マウスの移動速度に基づいて背景画像を自動的に回転させる方法について説明します。参照のためにそれを共有してください。特定の実装方法は次のとおりです。
次のようにコードをコピーします。<
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<Title> JSは、マウスの周りですばやく回転する画像を実現します</title>
<meta http-equiv = "content-type" content = "text/html; charset = gb2312">
</head>
<body>
<スクリプト言語= "javascript">
<！ -
var images = '/favicon.ico';
var量= 7;
var速度= 1;
var runtime = 0;
var cntr = 0;
var xcntr = 100;
var pulse = 25;
var xpos = 0;
var ypos = 0;
変化する;
var temp;
/*私が使用した画像よりも大きいまたは小さい画像を使用する場合
カーソルは中央から外れます。下の2つの変数を中央に配置します。*/
var updown = -10;
var leftright = -5;
if（document.all）{
document.write（ '<div id = "iediv" style = "position：absolute; top：0px; left：0px">'）;
document.write（ '<div id = "c" style = "position：relative">'）;
for（n = 0; n <ant; n ++）
document.write（ '<img src = "'+images+'" style = "position：absolute; top：0px; left：0px; viviviled：hidden">'）;
document.write（ '</div>'）;
document.write（ '</div>'）;
関数followmouse（）{
xpos = document.body.scrollleft+event.x+updown;
ypos = document.body.scrolltop+event.y+leftright;
}
document.onmousemove = followmouse;
}
else if（document.layers）{
window.captureevents（event.mousemove）;
関数xfollowmouse（evnt）{
xpos = evnt.pagex+updown;
ypos = evnt.pagey+leftright;
}
window.onmousemove = xfollowmouse;
for
document.write（ "<layer name = 'n"+ns+"' left = '0' 'top =' 0 'visibility =' hide '> <img src ='"+images+"'> </layer>"）;
}
関数msi（）{
if（document.layers）{
for（i = 0; i <ns; i ++）
{
temp = "n"+i
document.layers [0] .visibility = 'show';
document.layers [0] .top = ypos+cntr*math.cos（（runtime+i*4.5）/5）;
document.layers [0] .left = xpos+cntr*math.sin（（runtime+i*4.5）/5）;
}
CNTR+= 1;
ランタイム+=速度;
stp = setimeout（ 'msi（）'、10）;
if（cntr> = 100）
{
CNTR = 100;
速度= 2.5;
for（i = 0; i <ns; i ++）
{
temp = "n"+i
document.layers [temp] .visibility = 'show';
document.layers [temp] .top = ypos+cntr*math.cos（（runtime-100）*i/90）;
document.layers [temp] .left = xpos+cntr*math.sin（（runtime-100）*i/90）;
}
}
if（ランタイム> 182）
{
速度= 0.5;
for（i = 0; i <ns; i ++）
{
temp = "n"+i
document.layers [temp] .top = ypos+xcntr*math.cos（（（runtime-182）+i*4.5）/5）;
document.layers [temp] .left = xpos+xcntr*math.sin（（（runtime-182）+i*4.5）/5）*math.cos（（runtime-182）/5）;
}
}
}
else if（document.all）{
for（i = 0; i <iediv.all.c.all.length; i ++）
{
iediv.all.c.all [0] .style.visibility = 'visible';
iediv.all.c.all [0] .style.top = ypos+cntr*math.cos（（runtime+i*4.5）/5）;
iediv.all.c.all [0] .style.left = xpos+cntr*math.sin（（runtime+i*4.5）/5）;
}
CNTR+= 1;
ランタイム+=速度;
stp = setimeout（ 'msi（）'、10）;
if（cntr> = 100）
{
CNTR = 100;
速度= 2.5;
for（i = 0; i <iediv.all.c.all.length; i ++）
{
iediv.all.c.all [i] .style.visibility = 'visible';
iediv.all.c.all [i] .style.top = ypos+cntr*math.cos（（runtime-100）*i/90）;
iediv.all.c.all [i] .style.left = xpos+cntr*math.sin（（runtime-100）*i/90）;
}
}
if（ランタイム> 182）
{
速度= 0.5;
for（i = 0; i <iediv.all.c.all.length; i ++）
{
iediv.all.c.all [i] .style.top = ypos+xcntr*math.cos（（（runtime-182）+i*4.5）/5）;
iediv.all.c.all [i] .style.left = xpos+xcntr*math.sin（（（runtime-182）+i*4.5）/5）*math.cos（（runtime-182）/5）;
}
}
}
if（ランタイム> 210）
{
xcntr- = 10;
}
if（document.layers）
_y = -window.innerwidth-90;
else if（document.all）
_y = -document.body.clientwidth-90;
if（xcntr <= _y）
{
Runtime = 0;
速度= 1;
cntr = 0;
xcntr = 100;
}
}
msi（）
//->
</script>
<スクリプト言語= "javascript">
<！ -
関数selectal（thefield）{
var tempval = eval（ "document。"+Thefield）
tempval.focus（）
tempval.select（）
}
//->
</script>
</body>
</html>
この記事がみんなのJavaScriptプログラミングに役立つことを願っています。