<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7"/>
<meta name="auther" content="fq" />
<title>获取鼠标坐标</title>
</head>
<body>
<script type="text/javascript">
function mousePosition(ev){
if(ev.pageX || ev.pageY){
return {x:ev.pageX, y:ev.pageY};
}
return {
x:ev.clientX + document.body.scrollLeft - document.body.clientLeft,
y:ev.clientY + document.body.scrollTop - document.body.clientTop
};
}
function mouseMove(ev){
ev = ev || window.event;
var mousePos = mousePosition(ev);
document.getElementById('xxx').value = mousePos.x;
document.getElementById('yyy').value = mousePos.y;
}
document.onmousemove = mouseMove;
</script>
X:<input id="xxx" type="text" /> Y:<input id="yyy" type="text" />
</body>
</html>
- 大小: 50.2 KB
分享到：
相关推荐
需要注意的是，由于浏览器兼容性问题，处理鼠标坐标时可能需要使用条件判断或库如jQuery来确保在所有浏览器中的正确行为。例如，在Firefox中，获取元素的精确坐标可能需要使用`getBoundingClientRect()`方法。 总结...
10. **兼容性测试**：由于浏览器对某些特性支持程度不同，需要进行广泛的兼容性测试，确保全景图在主流浏览器（如Chrome、Firefox、Safari和Edge）以及移动设备上都能正常工作。 综上所述，"jquery全景图附带坐标...
- IE的事件对象`event`有`x`和`y`属性，表示鼠标位置，而Firefox使用`event.pageX`和`event.pageY`。为了兼容，可以使用`event.clientX`和`event.clientY`，这两个属性在IE和Firefox中都可用。如果需要精确的坐标，...
4. **坐标计算**：插件计算元素相对于文档的位置，并根据鼠标移动更新元素位置。 5. **回调函数**：提供了多个回调函数，如`dragstart`、`drag`、`dragstop`，方便开发者在拖动过程的不同阶段进行自定义操作。 三...
由于各个浏览器对JavaScript的支持程度和实现方式有所差异，所以需要采取特定的策略来处理这些差异，以确保代码在Internet Explorer（IE）和Mozilla Firefox（FF）等浏览器上都能正常运行。以下是针对IE和FF兼容性...
至于兼容性问题，IE和Firefox对某些JavaScript特性支持的时间和方式有所不同。例如，老版本的IE不支持`addEventListener`，需要使用`attachEvent`。此外，IE使用`currentStyle`对象获取元素样式，而其他现代浏览器则...
- 在IE中，为了显示鼠标的手形指针，可以使用`cursor:hand`，而在Firefox和其他现代浏览器中，应该使用`cursor:pointer`。因此，为了确保在所有浏览器中一致的效果，应始终使用`cursor:pointer`。 2. 访问表单元素...
- **鼠标坐标**：IE的事件对象有`x`和`y`属性，Firefox有`pageX`和`pageY`。要获取一致的坐标值，可以使用条件语句检查并转换。 10. **事件源元素** - **事件源访问**：IE使用`event.srcElement`，Firefox使用`...
4. **兼容性**：由于jQuery的目标是跨浏览器兼容，所以此插件应确保在主流浏览器（如Chrome、Firefox、Safari、Edge和IE）中都能正常运行。 5. **可配置性**：为了满足不同的设计需求，插件应提供一些配置选项，...
4. 多浏览器兼容的实现方法：文档提到了脚本之家修正版，这可能意味着原有的脚本有兼容性问题，经过修正后可以同时兼容IE和Firefox。通常，兼容性的解决方法包括但不限于使用条件注释、特性检测、浏览器特定的属性或...
jQuery.imgAreaSelect兼容大部分现代浏览器，包括Firefox、Chrome、Safari、Opera以及Internet Explorer 6+。在移动设备上，如果支持触控，也可以通过触摸手势进行操作。 总之，jQuery.imgAreaSelect-0.9.2提供了...
- IE中的`event`对象提供了`x`和`y`属性来获取鼠标位置，而Firefox中没有。可以使用`event.clientX`和`event.clientY`作为替代，它们在大部分情况下等效。如果需要精确的坐标，可能需要计算`event.pageX`和`event....
至于兼容性，jQuery库本身已经对各种主流浏览器做了优化，包括IE6及以上版本，Firefox，Chrome，Safari，Opera等。但是，仍需注意CSS和JavaScript的浏览器兼容性问题，特别是在使用新的HTML5特性和CSS3样式时。可以...
这些插件通常具有良好的浏览器兼容性，支持主流的Chrome、Firefox、Safari、Edge以及IE9+。兼容性是选择插件时的重要考量因素，确保用户在各种环境下都能顺利使用。 ### 4. 实现原理 一个基本的图片裁剪流程包括：...
9. **兼容性测试**：确保你的拖拽布局在主流浏览器中都能正常工作，包括Chrome、Firefox、Safari、Edge等。 通过以上步骤，你可以实现一个基本的仿google自定义拖拽布局。当然，实际开发中可能会遇到更多细节问题，...
6. **浏览器兼容性**：虽然jQuery已经做了很好的浏览器兼容性处理，但在实际应用中仍需测试不同浏览器下的表现，确保在IE、Firefox、Chrome等主流浏览器上都能正常工作。 总的来说，"jQuery商品放大镜预览代码.zip...
花生米AJAX-UI系列之:基于JQUERY的CurveChart统计用曲线图0.1版 特点： 本功能类是建立在JQUERY1.3.2的基础之上 //feature: ...经测试，兼容IE6--IE8，Firefox,chrome浏览器，在非IE浏览器下更加美观:)。
5. **兼容性**：imgAreaSelect通常与所有主流浏览器兼容，包括IE6+、Firefox、Chrome、Safari和Opera。 使用这个插件的过程大致如下： 1. **引入资源**：首先，在HTML页面中引入jQuery库和imgAreaSelect的JS和CSS...
在获取鼠标坐标位置时，IE 和 Firefox 也有所不同。IE 使用`event.x`和`event.y`，而 Firefox 使用`event.pageX`和`event.pageY`。为了解决这一问题，可以采用如下代码： ```javascript var mX = event.x ? event.x...
7. **兼容性考虑**：开发过程中需确保代码兼容主流浏览器，如Chrome、Firefox、Safari和Edge等，可能需要使用`feature detection`技术来检测浏览器特性，或者引入polyfill库以弥补不支持的特性。 8. **可扩展性和...