假设我有一个以缩放方式显示其来源的图像,我如何使用MouseMove事件在标签或文本块中显示光标所在的像素位置?
(我需要像素坐标而不是图像相对于其大小的坐标)
提前致谢.
我一直在手动设置每个按钮的事件,但我如何概括呢?
我想我可以覆盖ButtonBase,但我该怎么做?我是一个相对较新的C#程序员,我需要这个,因为我正在模拟一个真实的设备,所以我需要更改光标,以便用户知道他们可以点击的位置.
当我意识到它在Chrome控制台中引发数以千计的错误时,我只是将这个小鼠标跟踪示例放在一起.
Uncaught TypeError: Cannot read property 'clientX' of undefined
Run Code Online (Sandbox Code Playgroud)
AFAIK这意味着,chrome无法找到此属性所属的对象.但是,如果我打开这个例子,它会很好地显示正确的坐标.请帮我摆脱这些无用的错误.
<html>
<head>
<style type="text/css">
#tracking {
width: 300px;
height: 300px;
background-size: 300px 300px;
background-color: #00F;
left: 100px;
top: 100px;
position: absolute;
}
</style>
<script type="text/javascript">
var mX, mY;
var track;
document.onmousemove = update;
function trackload()
{
track = document.getElementById("tracking");
setTimeout("update()",10);
}
function update(e)
{
mX = e.clientX;
mY = e.clientY;
if (track) {
track.innerHTML = "X: " + mX + " Y: " + mY + " deg: " + …Run Code Online (Sandbox Code Playgroud) 我在某个网页上获取鼠标坐标并保存.
$("div#container").mousemove( function(e) {
client_x = e.pageX;
client_y = e.pageY;
// save x,y
});
Run Code Online (Sandbox Code Playgroud)
现在其他人加载相同的页面,我想向他们显示相同的坐标(x,x位置).
如果我必须考虑div#容器与浏览器中的位置不同(考虑屏幕分辨率和滚动),我怎么能得到同样的观点呢?
所以基本上我希望能够在有人在iOS或Android支持的触控设备的屏幕上滑动时获得触摸的坐标.
到目前为止我尝试做的事情如下.
$('element').bind("touchmove", function(e) {
$(element2).html(e.pageX + "," + e.pageY);
}
Run Code Online (Sandbox Code Playgroud)
加上我尝试了同样的"vmousemove"(jquery mobile等价物或它应该是),"mousemove"但无济于事.我只得到初始和结束触摸的坐标.
提前致谢
当在此 div 中按下右键时,我尝试使用 jquery 库将鼠标移动限制到 div 区域。我该怎么做?或者我能做的最好的问题?类似于限制屏幕部分的移动。
我有一个简单的片段,将onMouseMove侦听器附加到给定的 div:
<div onMouseMove={handleMouseMove}>
<div>A</div>
<div>B</div>
<div>C</div>
</div>
Run Code Online (Sandbox Code Playgroud)
我想知道鼠标指针在我附加鼠标侦听器的父 div 中的 X 位置。然而,该事件似乎只包含对子 div (as target) 和根 (as currentTarget) 的引用。
该事件的nativeEvent属性似乎也没有帮助。
我使用的是 React 17。我认为这使得事情变得更加困难,因为之前会currentTarget指向我放置侦听器的 div,但在 React 17 上,这些侦听器指向根。
如何获取我附加监听器的 div 内的坐标?
谢谢!
在我编写的程序中,我需要鼠标绝对位置在表单的左上角。我正在使用此代码:
Private Sub Form_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
Debug.Print "x: " & X & " - y: " & Y
End Sub
Run Code Online (Sandbox Code Playgroud)
当我使用此代码时,左上角的坐标为0,0。但是问题是,当我在表单中移动时,值太大了15倍。
这就是为什么我使用:
Private Sub Form_MouseMove(Button As Integer, Shift As Integer, X As Single, Y As Single)
Debug.Print "x: " & X / 15 & " - y: " & Y / 15
End Sub
Run Code Online (Sandbox Code Playgroud)
这样可以给出正确的坐标,但是为什么我需要将其乘以15?我不确定该代码是否在其他系统上兼容。
我已经将.fla文件转换为.js文件,我在该文件中的多个元素上添加了几个侦听器.其中'click','mousedown'和'mouseover'工作正常,但'pressmove'和'pressup'事件没有响应,它们甚至没有产生任何错误.这是我的代码片段:
/****this snippet is from converted .js file *********/
(lib.knob_rot_but = function(mode,startPosition,loop) {
this.initialize(mode,startPosition,loop,{});
// Layer 2
this.shape = new cjs.Shape();
this.shape.graphics.f().s("#999999").ss(0.5,1,1).p("ABlhlQArArAAA6QAAA7grAqQgqArg7AAQg6AAgrgrQgqgqAAg7QAAg6AqgrQArgqA6AAQA7AAAqAqg");
this.shape.setTransform(26.4,0);
this.shape_1 = new cjs.Shape();
this.shape_1.graphics.rf(["#FFFFFF","#CCCCCC","#999999","#666666"],[0.239,0.8,0.941,1],-0.2,0.2,0,-0.2,0.2,14.8).s().p("AhlBlQgqgqAAg7QAAg6AqgqQArgqA6gBQA7ABAqAqQAqAqAAA6QAAA7gqAqQgqAqg7AAQg6AAgrgqg");
this.shape_1.setTransform(26.4,0);
this.timeline.addTween(cjs.Tween.get({}).to({state:[{t:this.shape_1},{t:this.shape}]}).wait(4));
}).prototype = p = new cjs.MovieClip();
/******* My Listeners ******/
var helpButtonDown = DeviceService.getHelpButtonDown();
helpButtonDown.addEventListener("click", function(){alert("helpButtonDown button clicked")}); //works fine
var powerButtonUp = DeviceService.getPowerButtonUp();
powerButtonUp.addEventListener("click", function(){alert("powerButtonUp clicked")});//works fine
/*** Knob Listener***/
var knob = DeviceService.getKnob();
knob.addEventListener("mousedown", function(){console.log("mousedown on knob")}); //woks fine
knob.addEventListener("pressmove", function(evt){console.log("proess move on knob evt :" + evt)}); …Run Code Online (Sandbox Code Playgroud) 我正在使用以下JS代码来构建一个在悬停时滚动的水平图像轮播.该mousemove事件检测到鼠标移到容器并滚动到左边或相应的右的位置.一切都按照我的预期工作,但如果我在动画运行时将鼠标移到容器上,它会变得有点生涩.
这有什么解决方案吗?
谢谢
JS:
$( '.carousel-frame ul' ).mousemove( function(e) {
var container = $(this).parent();
if ((e.pageX - container.offset().left) < container.width() / 2) {
var direction = function() {
container.animate({scrollLeft: '-=600'}, 1000, 'linear', direction);
}
container.stop().animate({scrollLeft: '-=600'}, 1000, 'linear', direction);
} else {
var direction = function() {
container.animate({scrollLeft: '+=600'}, 1000, 'linear', direction);
}
container.stop().animate({scrollLeft: '+=600'}, 1000, 'linear', direction);
}
}).mouseleave( function() {
var container = $(this).parent();
container.stop();
});
Run Code Online (Sandbox Code Playgroud)
CSS:
.carousel-frame {
width: 100%;
margin-bottom: 0.5em;
padding-bottom: 1em;
position: …Run Code Online (Sandbox Code Playgroud)