Question

你好我试图在jQuery中使用.animate（）和.hover（）方法来上下动画。在我的DOM中，我有一个id =“＃menu”的div，它包含一个UL列表，每个列表的背景位于不同的x位置，但y位置相同。我的困境是出于某种原因，我的变量不起作用。它作为错误返回“无法读取空值的属性'1'。这意味着它不存在？

这是我的代码：

$("#menu li").hover(
 function () {
 var xPos = $(this).css('background-position-x')  
 $(this).animate({backgroundPosition: "("+ xPos + "0px)"}, 500); 

         }
 , 
 function () {
   var xPos = $(this).css('background-position-x')  
 $(this).stop().animate({backgroundPosition: xPos + "35px"}, 500); 

             }
);

Answer 1

我发现问题在于变量，当我检查alert（typeof xPos）时，它返回为undefined。我需要将此答案转换为整数值。

Answer 2

您可以尝试这可能会对您有所帮助。

实际默认值：0％0％在Css背景属性中。

$("#menu li").hover(
 function () {
 var xPos = $(this).css('background-position')  
 $(this).animate({backgroundPosition: "("+ xPos + "0px)"}, 500); 

         }
 , 
 function () {
   var xPos = $(this).css('background-position')  
 $(this).stop().animate({backgroundPosition: xPos + "35px"}, 500); 

             }
);

背景位置变量不起作用

2 个答案: