JS自动复制图片并跟随鼠标移动

2024-09-05 12:22:17

字体：大中小

来源：转载

供稿：网友

JavaScript 鼠标跟随特效，实现图片的自动复制并跟着鼠标移动，整体效果很炫，很有趣，数组中可以存放两个图片，你可以设置两张不同的图片，这样又是另一番效果。

<title>图片自动跟随鼠标移动</title><style type="text/css"></style><script language="JavaScript" type="text/JavaScript">kisserCount = 15curKisser = 0kissDelay = 1000kissSpacer = 50theimage = "http:/jscss/demoimg/200906/chat.gif" theimage2 = "http:/jscss/demoimg/200906/chat.gif"var docLayers = (document.layers) ? true:false;var docId = (document.getElementById) ? true:false;var docAll = (document.all) ? true:false;var docbitK = (docLayers) ? "document.layers['":(docId) ? "document.getElementById('":(docAll) ? "document.all['":"document."var docbitendK = (docLayers) ? "']":(docId) ? "')":(docAll) ? "']":""var stylebitK = (docLayers) ? "":".style"var showbitK = (docLayers) ? "show":"visible"var hidebitK = (docLayers) ? "hide":"hidden"var ns6=document.getElementById&&!document.allvar posX, posY, lastX, lastY, kisserCount, curKisser, kissDelay, kissSpacer, theimagelastX = 0lastY = 0function doKisser(e) {  posX = getMouseXPos(e)  posY = getMouseYPos(e)  if (posX>(lastX+kissSpacer)||posX<(lastX-kissSpacer)||posY>(lastY+kissSpacer)||posY<(lastY-kissSpacer)) {    showKisser(posX,posY)    lastX = posX    lastY = posY  }}function getMouseXPos(e) {  if (document.layers||ns6) {    return parseInt(e.pageX+10)  } else {    return (parseInt(event.clientX+10) + parseInt(document.body.scrollLeft))  }}function getMouseYPos(e) {  if (document.layers||ns6) {    return parseInt(e.pageY)  } else {    return (parseInt(event.clientY) + parseInt(document.body.scrollTop))  }}function showKisser(x,y) {  var processedx=ns6? Math.min(x,window.innerWidth-75) : docAll? Math.min(x,document.body.clientWidth-55) : x  if (curKisser >= kisserCount) {curKisser = 0}  eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".left = " + processedx)  eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".top = " + y)  eval(docbitK + "kisser" + curKisser + docbitendK + stylebitK + ".visibility = '" + showbitK + "'")  if (eval("typeof(kissDelay" + curKisser + ")")=="number") {    eval("clearTimeout(kissDelay" + curKisser + ")")  }  eval("kissDelay" + curKisser + " = setTimeout('hideKisser(" + curKisser + ")',kissDelay)")  curKisser += 1}function hideKisser(knum) {  eval(docbitK + "kisser" + knum + docbitendK + stylebitK + ".visibility = '" + hidebitK + "'")}function kissbegin(){if (docLayers) {  document.captureEvents(Event.MOUSEMOVE)  document.onMouseMove = doKisser} else {  document.onmousemove = doKisser}}window.onload=kissbegin</script><script language="JavaScript" type="text/JavaScript">if (document.all||document.getElementById||document.layers){for (k=0;k<kisserCount;k=k+2) {  document.write('<div id="kisser' + k + '" class="kisser"><img src="' + theimage + '" alt="" border="0"/></div>/n')  document.write('<div id="kisser' + (k+1) + '" class="kisser"><img src="' + theimage2 + '" alt="" border="0" /></div>/n')}}</script>

上一篇：鼠标移动就触发的JS实现方法

下一篇：JavaScript获取X、Y坐标及事件位置实例代码