Question

我正在尝试编写一个我想放入html网站的脚本。这个脚本的作用是它改变了鼠标光标位置的文本。例如。如果用户在（x，y）=（1,1）上，那么将显示一些文本，而如果在（x，y）=（2,2），则将显示一些其他随机文本。

var text = [ 'I am human.']

我不确定如何将其连接到鼠标事件。就像指针移动一样，显示文本列表中的任何随机文本。任何人都可以提供代码吗？真的会帮助我。谢谢！

Answer 1

在mousemove或其他内容上绑定window，然后在事件对象上使用screenX / screenY / clientX / clientY / etc。

一个简单的演示：

var $message = $('#message');

$(window).on('mousemove', function(e) {
    if(e.clientX > e.clientY) {
        $message.text('top right triangle');
    } else {
        $message.text('bottom left triangle');
    }
});

HTML：

<div id="message">Move the mouse.</div>

http://jsfiddle.net/qjtnd/

Answer 2

由于你正在使用JQuery，你可以使用mouse move function，如果你想要效果，你可以使用JQuery的animate。

使用Javascript：

$(document).mousemove(function(){
   var randText = text[Math.floor(Math.random()*text.length)];
   var div = $("#textDiv");
   div.stop().animate({"opacity": "0"}, 100, function(){
       $(this).html(randText);
       $(this).stop().animate({"opacity": "1.0"}, 100);
   });
});

HTML：

<div id="textDiv"></div>

Answer 3

var text = [ 'I am human.'
            , 'Some text here.'
            , 'I love technology.'
            , 'You are a good person'
            ]
$(document).mousemove(function(event) {
   var randomItem = text[Math.floor(Math.random()*text.length)];
    alert(randomItem);
});

见http://jsfiddle.net/2raaa/

用鼠标指针的位置变化来改变文本？

3 个答案: