Javascript mozilla中的鼠标移动事件不起作用

在这篇文章中，我在主体上有一个背景图像，当移动时，背景中的图像也会移动。 这方面的css是

      body
    {
background-image:url('../images/1.png');
background-size:98%;
background-position:center top;
background-repeat:no-repeat;

  } 


         <script>
         $(document).ready(function(){
         $('#big').mousemove(function(e){
         var mousePosX = (e.pageX/$(window).width())*100;
         $('#big').css('background-position-x', mousePosX +'%');
          var mousePosY = (e.pageY/$(window).height())*100;
         $('#big').css('background-position-y', mousePosY +'%');
         console.log(mousePosX, mousePosY);
       }); 
      });
     </script>

正文
{
背景图像：url（'../images/1.png'）；
背景大小：98%；
背景位置：中上；
背景重复：无重复；
} 
$（文档）.ready（函数（）{
$（“#大”）.mousemove（函数（e）{
var mousePosX=（e.pageX/$（window.width（））*100；
$（'#big'）.css（'background-position-x'，mousePosX+'%'）；
var mousePosY=（e.pageY/$（window.height（））*100；
$（'big'）.css（'background-position-y'，mousePosY+'%'）；
日志（mousePosX，mousePosY）；
}); 
});

---

我的问题是，这段代码在chrome上运行得很好，但在mozilla firefox上却不起作用，所以我该如何实现这一点。。。plz help me out

background-position-x

仅适用于webkit浏览器，但是您可以使用

background-position

并在同一行中声明这两个选项：

  var mousePosX = (e.pageX/$(window).width())*100;
  var mousePosY = (e.pageY/$(window).height())*100;
  $('#big').css('background-position', mousePosX +'%' + ' ' + mousePosY +'%');