📄 ch8-102.txt
字号:
<HTML>
<HEAD>
<TITLE>鼠标特效篇--图形跟随鼠标</TITLE>
</HEAD>
<BODY bgcolor="#fef4d2" >
<br><br>
<center>
<font color="ffaafa"><h2>鼠标特效篇--图形跟随鼠标</h2></font>
<hr width=300>
<br><br>
<!-- 案例代码开始 -->
<script language=JavaScript>
function MousePicture() {
layerRef="document.all";
styleSwitch=".style";
layerName = 'Picture'
eval('var curElement='+layerRef+'["'+layerName+'"]')
eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.visibility="hidden"')
eval('curElement'+styleSwitch+'.visibility="visible"')
eval('newleft=document.body.clientWidth-curElement'+styleSwitch+'.pixelWidth')
eval('newtop=document.body.clientHeight-curElement'+styleSwitch+'.pixelHeight')
eval('height=curElement'+styleSwitch+'.height')
eval('width=curElement'+styleSwitch+'.width')
width=parseInt(width)
height=parseInt(height)
if (event.clientX > (document.body.clientWidth - 6 - width)) { newleft=document.body.clientWidth + document.body.scrollLeft - 6 - width }
else { newleft=document.body.scrollLeft + event.clientX }
eval('curElement'+styleSwitch+'.pixelLeft=newleft')
if (event.clientY > (document.body.clientHeight - 6 - height)) { newtop=document.body.clientHeight + document.body.scrollTop - 6 - height }
else { newtop=document.body.scrollTop + event.clientY }
eval('curElement'+styleSwitch+'.pixelTop=newtop')
}
document.onmousemove = MousePicture;
document.write('<div ID=OuterDiv>')
<!-- [Step1]: 这里可以更改跟随鼠标的图形名称 -->
<!-- [Step2]: 在此能够设置图形的宽度和高度-->
document.write('<img ID=Picture src="Picture001.jpg" STYLE="position:absolute; TOP:0pt; LEFT:0pt; width=150; height=50; Z-INDEX:2; visibility:hidden;">')
document.write('</div>')
</script>
<!-- 案例代码结束 -->
</BODY>
</HTML>
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -