Question

我有这段代码。

jQuery("#box").bind('mousemove', function(e){
       jQuery(".mousetail").css('background-position-x', (e.pageX - this.offsetTop - 437)+'px');
});

这使鼠标跟随光标。但是当我将鼠标放在盒子上（远离鼠尾）时，鼠标尾会立即出现在那个位置。我想用动画到达那里。此外，background-position-x似乎在Firefox中不起作用。有人可以告诉我在代码中使用background-position:0px *based on co-ord*的正确方法（我不知道正确的语法）

Answer 1

语法非常相似，它需要一个CSS参数，然后是持续时间参数，然后是一个回调（动画完成后要执行的内容）

jQuery(".mousetail").animate({
  'background-position-x' : (e.pageX - this.offsetTop - 437)+'px' //Use Colon instead of comma
  }, 300, //This number sets the duration of the animation
  function() {alert('animation complete!');} //Callback function
);

Answer 2

你试过这个吗？

jQuery("#box").bind('mousemove', function(e){
   jQuery(".mousetail").animate({'background-position-x': (e.pageX - this.offsetTop - 437)+'px'});
});

用.animate（）替换这个jquery .css（）函数

2 个答案: