Posted in Javascript onJanuary 09, 2014
以下为程序代码:<!DOCTYPE html/> <head> <script type="text/javascript" src="http://www.w3school.com.cn/jquery/jquery.js"></script> <script type="text/javascript"> $(function() { $(".v").mouseover(function() { var x = $("<div class='vs'></div>"); x.appendTo($('body')); x.css({ width : $(this).width() - 6, height : $(this).height() - 6, left : $(this).offset().left, top : $(this).offset().top }); $($.browser.msie ? this : x).mouseout(function(){ x.remove(); }); }); }); </script> <style> .vs {z-index:1000;position:absolute;border:3px solid red;} </style> </head> <body> <a href="#"><img src="http://img2.bdstatic.com/img/image/774730e0cf3d7ca7bcb7a7b223ebc096b63f624a89b.jpg" border="0" class="v" /></a> <a href="#"><img src="http://img2.bdstatic.com/img/image/774730e0cf3d7ca7bcb7a7b223ebc096b63f624a89b.jpg" border="0" /></a> <a href="#"><img src="http://img2.bdstatic.com/img/image/774730e0cf3d7ca7bcb7a7b223ebc096b63f624a89b.jpg" border="0" class="v" /></a> </body> </html>
点击查看演示:http://biyuan.tk/u/upload/201311131123292656.html
JQuery实现鼠标移动到图片上显示边框效果
声明:登载此文出于传递更多信息之目的,并不意味着赞同其观点或证实其描述。
Reply on: @reply_date@
@reply_contents@