您当前的位置：飞翔学院-IT中国 → 编程开发 → JavaScript → 文章内容

鼠标框选框(1)

作者:佚名来源:不详发布时间:2008-5-23 9:02:38

来源：飞翔下载（www.52z.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.52z.com/" target="_blank">飞翔下载 www.52z.com 专业探讨【ASP、JavaScript、XHTML+CSS、SQL Server】</a><hr></div><img src="http://www.52z.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 全部选择提示：你可先修改部分代码，再按运行]

打印文档
推荐好友
返回顶部
增大字体
减少字体

鼠标框选框(1)

分类推荐

热点文章

精采文章

精采文章