LOGO OA教程 ERP教程 模切知识交流 PMS教程 CRM教程 开发文档 其他文档  
 
网站管理员

IE和FF下javascript获取网页及窗口大小的区别

admin
2010年10月16日 16:57 本文热度 3860
在新定义出来的标准下 document.documentelement.clientheight在ie和火狐里都能获取正确值,下面一篇文章详细介绍了获取各种浏览器可见窗口大小这方面的差别:[br][br][br][br]在本地测试当中:[br]在ie、firefox、opera下都可以使用[br]document.body.clientwidth[br]document.body.clientheight[br]即可获得,很简单,很方便。[br][br]而在公司项目当中:[br]opera仍然使用[br]document.body.clientwidth[br]document.body.clientheight[br]可是ie和firefox则使用[br]document.documentelement.clientwidth[br]document.documentelement.clientheight[br][br][br]如果在页面中添加这行标记的话[br][br]在ie中:[br]document.body.clientwidth ==> body对象宽度[br]document.body.clientheight ==> body对象高度[br]document.documentelement.clientwidth ==> 可见区域宽度[br]document.documentelement.clientheight ==> 可见区域高度[br]在firefox中:[br]document.body.clientwidth ==> body对象宽度[br]document.body.clientheight ==> body对象高度[br]document.documentelement.clientwidth ==> 可见区域宽度[br]document.documentelement.clientheight ==> 可见区域高度[br]?[br]在opera中:[br]document.body.clientwidth ==> 可见区域宽度[br]document.body.clientheight ==> 可见区域高度[br]document.documentelement.clientwidth ==> 页面对象宽度(即body对象宽度加上margin宽)[br]document.documentelement.clientheight ==> 页面对象高度(即body对象高度加上margin高)[br][br][br]用 javascript 获取当页面上鼠标(光标)位置在许多情况下都会用到,比如拖放,悬停提示(tooltip)等等。当然,这里我们依然要面对浏览器的兼容问题,在不同的浏览器下,对[br][br]这些相关的属性处理方式也不同,本文详细介绍了浏览器在处理这些属性时的差异和最终的解决方法。[br][br][br][br]上面的代码我们在 怎么用 javascript 实现拖拽中已经介绍过了,由于这个需求我们经常用到,所以我们将这段代码独立成一篇文章,供新手查询。[br][br]使用方式:[br]code:[br]document.onmousemove = mousemove;[br]function mousemove(ev){[br] ev = ev || window.event;[br] var mousepos = mouseposition(ev);[br]}[br][br]关于代码的详细说明,原文中已经介绍,现转到此处:[br][br]我们首先要声明一个 evnet 对象,无论移动、点击、按键等,都会激活一个 evnet ,在 internet explorer 里, event 是全局变量,会被存储在 window.event 里. 在 firefox[br][br]或者其他浏览器,event 会被相应的函数获取.当我们将mousemove函数赋值于document.onmousemove,mousemove 会获取鼠标移动事件。[br][br]为了让 ev 在所有浏览器下获取了 event 事件,在firefox下"||window.event"将不起作用,因为ev已经有了赋值。在 msie 中 ev 为空,所以得到 window.event 。[br][br]因为在这篇文章中我们需要多次获取鼠标位置,所以我们设计了一个 mouseposition 函数,它包含一个参数 : event 。[br][br]因为我们要在 msie 和其他浏览器下运行,firefox 和其他浏览器用 event.pagex 和 event.pagey 来表示鼠标相对于文档的位置,如果你有一个 500*500 的窗口并且你的鼠标在绝对[br][br]中间,那么 pagex 和 pagey 的值都是 250,如果你向下滚动 500, 那么 pagey 将变成 750。[br][br]msie 正好相反,它使用 event.clientx 和 event.clienty 表示鼠标相当于窗口的位置,而不是文档。在同样的例子中,如果你向下滚动 500,clienty 依然是 250,因此,我们需要[br][br]添加 scrollleft 和 scrolltop 这两个相对于文档的属性。最后,msie 中文档并不是从 0,0 开始,而是通常有一个小的边框(通常是 2 象素),边框的大小定义在 [br][br]document.body.clientleft 和 clienttop 中,我们也把这些加进去。[br][br]很幸运,我们现在已经用 mouseposition 函数解决了坐标问题,不需为此费心了。[br]tag标签: ie,ff,javascript,clientwidth,clientheight

该文章在 2010/10/16 16:57:24 编辑过
关键字查询
相关文章
正在查询...
点晴ERP是一款针对中小制造业的专业生产管理软件系统,系统成熟度和易用性得到了国内大量中小企业的青睐。
点晴PMS码头管理系统主要针对港口码头集装箱与散货日常运作、调度、堆场、车队、财务费用、相关报表等业务管理,结合码头的业务特点,围绕调度、堆场作业而开发的。集技术的先进性、管理的有效性于一体,是物流码头及其他港口类企业的高效ERP管理信息系统。
点晴WMS仓储管理系统提供了货物产品管理,销售管理,采购管理,仓储管理,仓库管理,保质期管理,货位管理,库位管理,生产管理,WMS管理系统,标签打印,条形码,二维码管理,批号管理软件。
点晴免费OA是一款软件和通用服务都免费,不限功能、不限时间、不限用户的免费OA协同办公管理系统。
Copyright 2010-2024 ClickSun All Rights Reserved