Question

var d= $('#menu-top-menu').children();
d.hover(function(){
    var e= $(this).position().left;
    var f= $(this).parent().position().left;
    var g= e-f;
    $('#menu-top-menu').animate({backgroundPosition, g + "px 3px"});
    console.log(g);
});

我不知道为什么它不是动画。你能给我一些解决问题的线索吗？感谢

Answer 1

您需要提供单独设置动画的属性，而正确的语法是将对象参数的键/值分隔为:而不是逗号。试试这个：

var d= $('#menu-top-menu').children();
d.hover(function(){
    var e= $(this).position().left;
    var f= $(this).parent().position().left;
    var g= e-f;
    $('#menu-top-menu').animate({
        'background-position-x': g + 'px', 
        'background-position-y': '3px'
    });
    console.log(g);
});

假设它永远不会改变，你也可以省略background-position-y，并在CSS中设置。

Answer 2

检查一下......希望它能起作用（求助：http://api.jquery.com/animate/）：

$("#menu-top-menu").animate({
    background-position-x:"20px", 
    background-position-y: "3px"
  },1500);

jQuery背景位置没有动画

2 个答案: