<html>
<head>
<title>JS跟随鼠标旋转的图片丨Daniel wellington</title>
<script>
<!-- Beginning of JavaScript -
var x,y
var step=5
var flag=1
var pause
var timersmall
var timerbig
var isbigcircle=1
var pause=50
var bigradius
var smallradius=50
var startwinkel=1
var imgnumber=12
var imgsrc="/images/7caidy.ico"
var xcenter
var xcenter
var pi= Math.PI
function onresizer() {
clearTimeout(timerbig)
clearTimeout(timersmall)
initiate()
}
function initiate() {
var initiatetimer=setTimeout("initiate2()",2000)
}
function initiate2() {
if (document.layers) {
xcenter=Math.floor(screen.width/2)
ycenter=Math.floor(window.innerHeight/2)
}
if (document.all) {
xcenter=Math.floor(document.body.clientWidth/2)
ycenter=Math.floor(document.body.clientHeight/2)
}
bigradius=ycenter
bigcircle()
}
function handlerMM(e){
x = (document.layers) ? e.pageX : event.clientX
y = (document.layers) ? e.pageY : event.clientY
flag=1
}
function bigcircle() {
if (isbigcircle==1) {
if (document.all) {
for (i=1; i<=imgnumber; i++) {
var thisspan = eval("document.all.span"+(i)+".style")
thisspan.posLeft=((xcenter-20)*Math.cos(startwinkel*(pi/180)))+xcenter
thisspan.posTop=((ycenter-20)*Math.sin(startwinkel*(pi/180)))+ycenter
startwinkel=startwinkel+30
}
}
if (document.layers) {
for (i=1; i<=imgnumber; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=((xcenter-150)*Math.cos(startwinkel*(pi/180)))+(xcenter-145)
thisspan.top=((ycenter-20)*Math.sin(startwinkel*(pi/180)))+ycenter
startwinkel=startwinkel+30
}
}
step=step+5
startwinkel=step
timerbig=setTimeout("bigcircle()",pause)
}
else {
isbigcircle=0
clearTimeout(timerbig)
}
}
function presmallcircle() {
isbigcircle=0
clearTimeout(timerbig)
smallcircle()
}
function prebigcircle() {
isbigcircle=1
clearTimeout(timersmall)
bigcircle()
}
function smallcircle() {
if (isbigcircle==0) {
if (document.all) {
for (i=1; i<=imgnumber; i++) {
var thisspan = eval("document.all.span"+(i)+".style")
thisspan.posLeft=(smallradius*Math.cos(startwinkel*(pi/180)))+x
thisspan.posTop=(smallradius*Math.sin(startwinkel*(pi/180)))+y
startwinkel=startwinkel+30
}
}
if (document.layers) {
for (i=1; i<=imgnumber; i++) {
var thisspan = eval("document.span"+i)
thisspan.left=(smallradius*Math.cos(startwinkel*(pi/180)))+x
thisspan.top=(smallradius*Math.sin(startwinkel*(pi/180)))+y
startwinkel=startwinkel+30
}
}
step=step+5
startwinkel=step
timersmall=setTimeout("smallcircle()",pause)
}
else {
isbigcircle=0
clearTimeout(timersmall)
}
}
window.onoad=initiate()
// - End of JavaScript - -->
</script>
<style>
.spanstyle {
position:absolute;
visibility:visible;
top:-50px;
font-size:10pt;
font-family:Verdana;
color:FF0000
}
.explain {
position:absolute;
top:40px;
left:10px;
width:560px;
color: 000000;
text-align:center;
font-size:9pt;
font-family:Arial;
font-weight:bold;
}
A { font-family: Arial,Helvetica,sans-serif;
color: #000000;
text-decoration:underline
}
A:visited {
color: #000000;
}
</style>
</head>
<body bgcolor="#FFFFFF">
<p align="center"> </p>
<script>
<!-- Beginning of JavaScript -
for (i=1;i<=imgnumber;i++) {
document.write("<span id=‘span"+i+"‘ class=‘spanstyle‘>")
document.write("<img src=‘"+imgsrc+"‘>")
document.write("</span>")
}
if (document.layers){
document.captureEvents(Event.MOUSEMOVE);
}
document.onmousemove = handlerMM;
document.onresize = onresizer;
// - End of JavaScript - -->
</script>
<div id="source" class="explain" style="left: 111px; top: 143px"><a href="#nogo"
onMouseOver="presmallcircle()" onMouseOut="prebigcircle()">
<p>快把鼠标指向这个！看一下是不是很棒的效果！</p>
</a>
</div>
<p><br>
<br>
</p>
<p> </p>
<p> </p>
<p> </p>
<p> </p>
<p align="center" style="line-height: 20px"><font color="#666666"><span
style="font-size: 9pt"><br>
</span></font><span
style="font-size: 9pt"><br>
</span></p>
<span
style="font-size: 9pt">
<p align="center" style="line-height: 20px">
<font face="Arial, Helvetica, sans-serif" color="#666666"></font> </p>
</span></body>
</html>
<br><br><hr>
时间： 2024-10-18 16:42:58