8

我希望能够拥有一个 div，当鼠标在该 div 内时，我会在光标旁边得到一个小圆形标记。当我移出这个 div 时，光标标记被删除并隐藏。

我找到了一个我想要但不完全是我需要的例子：-

http://jsfiddle.net/3964w/3/

上述问题： - 我只希望当我在那个 div 内时出现黄色标记 - 当我在那个 div 之外时，标记被隐藏并且光标是正常的。- 当我移动鼠标时，标记离光标太远

有任何想法吗？

var mouseX = 0, mouseY = 0, limitX = 150-15, limitY = 150-15;
$(window).mousemove(function(e){
 mouseX = Math.min(e.pageX, limitX);
 mouseY = Math.min(e.pageY, limitY);
});

// cache the selector
var follower = $("#follower");
var xp = 0, yp = 0;
var loop = setInterval(function(){
// change 12 to alter damping higher is slower
xp += (mouseX - xp) / 12;
yp += (mouseY - yp) / 12;
follower.css({left:xp, top:yp});

}, 30);

谢谢

4

5 回答 5

3

你不能用css吗？像这样的东西：http: //jsfiddle.net/felipemiosso/3964w/30/

刚刚添加display:none;并#follower创建了新样式.centerdiv:hover #follower { display:block; }

要在光标停止时固定指针，请添加margin-left:-8px; margin-top:-8px;到#follower.

更新了小提琴 http://jsfiddle.net/felipemiosso/3964w/35/

更新了小提琴 2 http://jsfiddle.net/felipemiosso/3964w/41/

于 2013-11-04T15:32:15.217 回答
1

您可以执行类似的操作，添加display: none到关注者 css，然后：http: //jsfiddle.net/3964w/32/

$('.container').mousemove(function(e){
$("#follower").show();
  var offset = $('.container').offset();

   mouseX = Math.min(e.pageX - offset.left, limitX);
   mouseY = Math.min(e.pageY - offset.top, limitY);
   if (mouseX < 0) mouseX = 0;
   if (mouseY < 0) mouseY = 0;
});

$('.container').mouseleave(function() {
        $("#follower").hide(); 
});
于 2013-11-04T15:33:22.663 回答
1

问题出在 setInterval 函数中，该函数每 30 毫秒调用一次，使用onmousemovediv 中的 when 来获取坐标。并在 上显示关注者mouseenter。隐藏在mouseleave

于 2013-11-04T15:33:32.163 回答
0

更改容器 css 属性

.anyclass{
    cursor: URL("smallcircle.png");
 }
于 2013-11-04T15:46:58.927 回答
0

你可以使用这个库，我发现它非常好。 http://www.tippedjs.com/

于 2015-10-01T04:40:01.180 回答