鼠标框选框(1)

作者：ITPOW 来源：ITPOW（原创）日期：2006-3-13

来源：ITPOW（www.itpow.com）

Windows 资源管理器中，在空白处按住鼠标并拖动，就会形成一个框，假设我们命名为框选框（因为它可以框选多个文件（夹）），本文是在网页中模拟这个效果，在 IE 中预览，效果非常逼真。

起初是打算兼容 Netscape 和 FireFox 等浏览器的，但这些浏览器中不支持 style.pixelLeft，得使用 style.left 之类的（style.pixelLeft 为数字无单位，style.left 为文本有单位），实际使用中发现效果很不好，有延迟状，所以还是使用 style.pixelLeft，缺点是仅支持 IE 系列浏览器。

本文是在网页任意部分实现框选效果，要在网页的某一部分实现框选效果，请参见网页框选框(2)

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>鼠标框选框</title> </head> <body> <div> <a href="http://www.itpow.com/" target="_blank">ITPOW www.itpow.com 专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</a> <hr> </div> <img src="http://www.itpow.com/upload/720/code.jpg" ondrag="javascript:return false;"> <div id="box" style="position:absolute;display:none;width:0px;height:0px;border:1px solid #0000FF;background-color:#99CCFF;font-size:1px;filter:alpha(opacity=50);"></div> <script language="javascript">  </script> </body> </html>
[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

电邮：cftea@126.com