<script type="text/javascript" language="javascript"> function showimg(imgpath){ var x = event.clientX; var y = event.clientY; /*alert(imgpath);*/ document.getElementById("popup").innerHTML = "<img src='" + imgpath + "' width=280 height=280/>"; document.getElementById("popup").style.top = y + 50; document.getElementById("popup").style.left = x; document.getElementById("popup").style.visibility = "visible" } function clearimg(){ document.getElementById("popup").style.visibility = "hidden" } </script> <body> <font color="blue"><strong>当鼠标放到图片上时，会弹出一个放大的图片</strong></font> <BR/> <BR/> <font color="green"><strong>当鼠标从图片上移出时，弹出的图片就会消失</strong></font> <BR/> <BR/> <img src="images/丢丢丢.gif" onmouseover="showimg('images//丢丢丢.gif')" onmouseout="clearimg();"> <div id="popup" style="position: absolute; border: solid 2px; visibility: hidden" /> </body>
鼠标悬停之放大图片的效果
最新推荐文章于 2023-11-04 00:05:06 发布
本文介绍了一种使用JavaScript实现的鼠标悬停显示放大图片的效果。当鼠标移动到指定的小图上时，会弹出一个放大的图片预览；当鼠标离开时，预览图片自动隐藏。此功能通过简单的JavaScript函数和HTML结构实现。
扫一扫
2996
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
