Este artigo descreve o método de girar automaticamente a imagem de fundo com base na velocidade do movimento do mouse. Compartilhe para sua referência. O método de implementação específico é o seguinte:
Copie o código da seguinte forma: <! Doctype html public "-// w3c // dtd xhtml 1.0 transitória // pt" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns = "http://www.w3.org/1999/xhtml">
<head>
<title> JS percebe a imagem para girar rapidamente em torno do mouse </ititle>
<meta http-equiv = "content-type" content = "text/html; charset = gb2312">
</head>
<Body>
<Script Language = "JavaScript">
<!-
var imagens = '/favicon.ico';
Var valor = 7;
var velocidade = 1;
Var tempo de execução = 0;
var cntr = 0;
var xcntr = 100;
var pulse = 25;
var xpos = 0;
var ypos = 0;
var _Y;
var temp;
/*Se você usar uma imagem maior ou menor que a que eu usei
o cursor estará fora do centro. Além das 2 variáveis abaixo para centralizá -lo.*/
var updutown = -10;
var Leftright = -5;
if (document.all) {
document.write ('<div id = "iediv" style = "posição: absoluto; top: 0px; esquerda: 0px">');
document.write ('<div id = "c" style = "posição: relativa">');
para (n = 0; n <valor; n ++)
document.write ('<img src = "'+imagens+'" style = "posição: absoluto; topo: 0px; esquerda: 0px; visibilidade: oculta">');
document.write ('</div>');
document.write ('</div>');
function slogeMouse () {
Xpos = document.body.scrollleft+event.x+updown;
Ypos = document.body.scrolltop+event.y+leftright;
}
document.onMousEMove = sigaMouse;
}
else if (document.layers) {
window.captureEvents (event.mouseMove);
função xfollowMouse (evnt) {
Xpos = evnt.pagex+updown;
Ypos = evnt.pagey+leftright;
}
window.onMousEMove = xFollowMouse;
for (ns = 0; ns <quantidade; ns ++)
document.write ("<nome da camada = 'n"+ns+"' esquerda = '0' top = '0' visibilidade = 'hide'> <img src = '"+imagens+"'> </sayer>");
}
função msi () {
if (document.layers) {
para (i = 0; i <ns; i ++)
{
temp = "n"+i
document.layers [0] .visibility = 'show';
document.layers [0] .top = yPOS+cntr*math.cos ((tempo de execução+i*4.5)/5);
document.layers [0] .left = xpos+cntr*Math.sin ((Runtime+I*4.5)/5);
}
cntr+= 1;
Tempo de execução+= velocidade;
stp = setTimeout ('msi ()', 10);
if (cntr> = 100)
{
cntr = 100;
velocidade = 2,5;
para (i = 0; i <ns; i ++)
{
temp = "n"+i
document.layers [temp] .visibility = 'show';
document.layers [temp] .top = ypos+cntr*math.cos ((tempo de execução-100)*i/90);
document.layers [temp] .left = xpos+cntr*Math.sin ((Runtime-100)*i/90);
}
}
IF (tempo de execução> 182)
{
velocidade = 0,5;
para (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 = 'visível';
iediv.all.c.all [0] .style.top = ypos+cntr*math.cos ((tempo de execução+i*4.5)/5);
iediv.all.c.all [0] .style.left = xpos+cntr*Math.sin ((Runtime+i*4.5)/5);
}
cntr+= 1;
Tempo de execução+= velocidade;
stp = setTimeout ('msi ()', 10);
if (cntr> = 100)
{
cntr = 100;
velocidade = 2,5;
for (i = 0; i <iediv.all.c.all.length; i ++)
{
iediv.all.c.all [i] .style.visibility = 'visível';
iediv.all.c.all [i] .style.top = yPOS+cntr*math.cos ((tempo de execução-100)*i/90);
iediv.all.c.all [i] .style.left = xpos+cntr*math.sin ((RUNTIME-100)*i/90);
}
}
IF (tempo de execução> 182)
{
velocidade = 0,5;
for (i = 0; i <iediv.all.c.all.length; i ++)
{
iediv.all.c.all [i] .style.top = ypos+xcntr*math.cos (((tempo de execução-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 (tempo de execução> 210)
{
xcntr- = 10;
}
if (document.layers)
_y = -window.innerwidth-90;
caso contrário, se (document.all)
_y = -document.body.clientWidth-90;
if (xcntntr <= _y)
{
Tempo de execução = 0;
velocidade = 1;
cntr = 0;
xcntr = 100;
}
}
msi ()
//->
</script>
<Script Language = "JavaScript">
<!-
função selectall (thefield) {
var tempval = avaliar ("documento".+thefield)
tempval.focus ()
tempval.Select ()
}
//->
</script>
</body>
</html>
Espero que este artigo seja útil para a programação JavaScript de todos.