我遇到了关于鼠标光标在我的SVG文档中的位置的麻烦.我想在HTML页面中使用JavaScript设计一个在拖动时跟随光标的电位计.
我尝试了evt.clientX/Y和evt.screenX/Y,但由于我的SVG处于自动缩放状态,因此我的SVG中的坐标是不同的.我现在一直在寻找答案,但我找不到任何解决方案(要么实时了解我的SVG重新缩放因子,要么在SVG坐标系统中具有鼠标位置功能).
轮换将遵循一个简单的规则:
if(evt.screenX <xc)ang = Math.atan((evt.screenY - yc)/(evt.screenX - xc))*360 /(2*Math.PI) - 90;
if(evt.screenX> xc)
ang = Math.atan((evt.screenY - yc)/(evt.screenX - xc))*360 /(2*Math.PI)+ 90;
用(xc; yc)作为旋转中心,用SVG中鼠标的坐标替换所有evt.screenX/Y.
jQuerys偏移函数有时返回顶部或左侧的有理数(如12.645613).我认为顶部和左侧位置都是像素,所以应该是整数(没有半像素,或?).
可能重复:
jQuery在元素中获取鼠标位置
我有一个页面,在那个页面里面我有一个div.如果用户在该div内部单击,它将存储他们在该div中单击的位置的X/Y坐标.
例如,如果我点击div的左上角(无论div放在页面的哪个位置),它都会返回大约0,0.
这甚至可能吗?如果是这样,你能告诉我 - 或者甚至指出我正确的方向吗?
我有一个长矩形div(父),里面有几个较小的div(child).我想单击长矩形div(包括子div)上的任意位置以显示父div左侧的偏移量.
目前这个javascript代码仅在我点击小div之外时才有效,只要我在子div中单击,它就会显示子div的偏移量.我是javascript的新手,似乎无法找到相关的答案.
我希望有人可以提前帮助,谢谢.
window.onload = function(){
parentDiv.addEventListener('click',function(e){
alert(e.offsetX);
}, false);
Run Code Online (Sandbox Code Playgroud) 使用两行CSS手动调整元素的大小非常容易。像这样:
div {
resize: both;
overflow: auto;
/*
/ Styling
*/
width: 100px;
height: 100px;
border: 1px solid #333333;
}Run Code Online (Sandbox Code Playgroud)
<div></div>Run Code Online (Sandbox Code Playgroud)
现在,我想检测用户何时单击了元素的调整大小手柄。
奇怪的是,Internet Explorer似乎是唯一将onResize事件附加到元素(窗口除外)的浏览器。但是,即使其他浏览器实现了此功能,也不是我要查找的内容,因为我需要知道何时单击调整大小手柄,而不是调整大小。
我研究了将侦听器附加到mousedown并检查currentTargetvs,target以查看它们是否不同。没有运气-都返回元素本身。
我的最后也是最后一个不得已的方法是检查单击位置,以查看它是否位于元素的右下角。但是,这似乎很可笑且不可靠。
是否存在用于检测元素的调整大小手柄上的单击或事件的可靠方法?
我有一个div,其中包含大量文本.我的问题是,是否有可能检测到div边框上的点击?
我想要完成的是如果用户点击底部边框(使用CSS设置4px宽的样式),div会一直滚动到底部.如果不添加更多标记,这是否可行?
作业说:"你的任务是写一个包含JavaScript的HTML文件,它将随机显示上面的一个图像.如果页面在浏览器中刷新,你应该得到另一个随机图像." 所以我做到了
现在它说"当用户点击图像上的任何位置时,显示一个警告窗口,显示点击相对于图像的位置的X和Y位置".这是我的代码:
<html>
<head>
<title>Assignment 2</title>
<script type="text/javascript">
var imageURLs = [
"p1.jpg"
, "p2.jpg"
, "p3.jpg"
, "p4.jpg"
];
function getImageTag() {
var img = '<img src=\"';
var randomIndex = Math.floor(Math.random() * imageURLs.length);
img += imageURLs[randomIndex];
img += '\" alt=\"Some alt text\"/>';
return img;
}
</script>
</head>
<body>
<script type="text/javascript">
document.write(getImageTag());
</script>
</body>
</html>Run Code Online (Sandbox Code Playgroud)
是否可以使用 HTML 画布或 Javascript 单击图像的一部分,并根据您单击的部分触发 Javascript 事件?
所以,例如;
如果我有一个手表的图像并且用户点击表带,这会触发一个与表带相关的内容的模态。同样,如果他们点击其中一个表针,这会触发不同的模态。