onmousemove事件

Question

我想在onmousemove事件上用javascript更改左邊和頂部樣式元素，但它不起作用。

我對的OnMouseMove事件代碼：

function mymove(e) 
{ 
var event=new MouseEvent(e); 
    x = 20; 
    y = 10;  

    document.getElementById('mye').style.left = event.pageX + x+'px' ; 
    document.getElementById('mye').style.top = event.pageY - y+'px'; 


    } 

Answer 1

猜測的標記和CSS。另外，我認爲e屬性可能會改變每個瀏覽器。這適用於Firefox（9）。

CSS

#mye { 
    height: 25px; 
    width: 250px; 
    position: absolute; 
    background: #ddd; 
} 

標記

<div id="mye">Content</div> 

的Javascript

var mymove = function (e) { 
    var x = 20, 
     y = 10, 
     mye = document.getElementById('mye'); 

    mye.style.left = (parseInt(e.clientX) + x) + 'px'; 
    mye.style.top = (parseInt(e.clientY) - y) + 'px'; 
}; 

// Don't forget to add this in an onload or ondomready. 
document.getElementById('mye').onmousemove = mymove; 

http://jsfiddle.net/3YdEa/6/

和便箋，傑弗裏·斯威尼提到，連接到window.onmousemove可能更常見：

window.onmousemove = mymove; 

http://jsfiddle.net/3YdEa/7/

這裏是Quirksmode鼠標事件位置財產的情況。但是，這已經過了幾年了。

這是另一個StackOverflow question，當然還有jQuery's $.mousemove()，這將消除瀏覽器之間的差異。