复制代码 代码如下: <script> function GetAbsPosition(obj) { var curleft = 0, curtop = 0; do { curleft += obj.offsetLeft; curtop += obj.offsetTop; } while (obj = obj.offsetParent); return [curleft,curtop]; } function ShowFloatingImage(image, width, height) { var id = "trailimageid"; var newdiv = document.getElementById(id); if(newdiv == null) { newdiv = document.createElement('div'); newdiv.setAttribute('id',id); newdiv.setAttribute('onmouseout', "HideElement('"+id+"');"); document.body.appendChild(newdiv); } newdiv.innerHTML = '<img src='+image.src+ ' width='+(image.width + width) + ' height=' + (image.height + height) + ' />'; var absPos = GetAbsPosition(image); newdiv.style.position = "absolute"; newdiv.style.posLeft = absPos[0] - width/2; newdiv.style.posTop = absPos[1] - height/2; newdiv.style.display="block"; } function HideElement(id) { var elem = document.getElementById(id); elem.style.display="none"; } </script> 例子: 复制代码 代码如下: <body> <img src="1.jpg" width="300" height="300" onmouseover="ShowFloatingImage(this, 150, 150);" /> </body> 经测试事件处理的不是很好。导致鼠标移开不能回到原位。
推荐阅读
jquery 跨域访问问题解决方法(笔记)
这两天需要实现三级域名直接url rewrite到网站静态页面,如 http://123.456.789.com/ UrlRewrite到http://www.789.com/news/123.html 说到这里,也许和js跨域访问没有半点关系,在脑海里排列这的问题都是和UrlRewr>>>详细阅读
本文标题:鼠标滑上去后图片放大浮出效果的js代码
地址:http://www.17bianji.com/kaifa2/JS/24528.html
1/2 1