JQuery是一個(gè)JavaScript框架,通過(guò)它可以方便地獲取鼠標(biāo)的X和Y坐標(biāo)。下面就讓我們來(lái)了解一下它的實(shí)現(xiàn)方法。
$(document).mousemove(function(e){ var x = e.pageX; var y = e.pageY; //在這里進(jìn)行其他操作 });
上面的代碼就是獲取鼠標(biāo)X和Y坐標(biāo)的方法,我們可以在mousemove事件中實(shí)現(xiàn)它。其中e是事件對(duì)象,pageX和pageY屬性表示鼠標(biāo)相對(duì)于頁(yè)面左上角的位置。
比如,我們可以在mousemove事件中實(shí)現(xiàn)鼠標(biāo)跟隨效果,例如讓一個(gè)div跟隨鼠標(biāo)的移動(dòng)。
$(document).mousemove(function(e){ var x = e.pageX; var y = e.pageY; $('#box').css({ 'left': x + 'px', 'top': y + 'px' }); });
上面的代碼可以讓ID為"box"的元素跟隨鼠標(biāo)移動(dòng)。其中通過(guò)css方法設(shè)置元素的left和top屬性使它跟隨鼠標(biāo)移動(dòng)。
總之,通過(guò)JQuery獲取鼠標(biāo)X和Y坐標(biāo)非常簡(jiǎn)單。只需要在mousemove事件中獲取事件對(duì)象的pageX和pageY屬性即可。
上一篇div v on