Question

我对Tweenlite js与背景图片存在问题。所以在这段代码中，我在背景上设置了一个地图，在它上面设置了一些点作为不同的图像，但仍然在后台。你可以在这里看到它

http://socialextensions.eu/maptest/gigi/index.html

现在，当我移动鼠标时，所有图像都是左右浮动，但我只想移动点并使地图保持稳定。做了一些研究，但我没有运气。

这是代码

html中的

脚本

$(document).ready(function(){
  $(document).mousemove(function(e){
    TweenLite.to($('body'), .5, { css: {
        backgroundPosition: "" + parseInt(event.pageX/8)    + "px " 
                               + parseInt(event.pageY/'12') + "px, "
                               + parseInt(event.pageX/'15') + "px " 
                               + parseInt(event.pageY/'15') + "px, "
                               + parseInt(event.pageX/'30') + "px "                       
                               + parseInt(event.pageY/'30') + "px"
      }
    });
  });
});

CSS

body
{
  background-color: #242424;
  background-size: cover;
  padding: 0;
  margin: 0;
  background: url(../images/mapbg.jpg);
  background-color: #444;
  background: url(http://mymaplist.com/img/parallax/pinlayer2.png),url(http://mymaplist.com/img/parallax/pinlayer1.png),url(../images/mapbg.jpg);  
  background-repeat: no-repeat;
}

任何人都有任何想法？

我已经尝试更改.5，您可以在js代码中看到parseInt(event.pageX/8)，但它只会缓慢移动。

还尝试将css放到像这样的特定网址图片

body
{
  background-color: #242424;
  background-size: cover;
  padding: 0;
  margin: 0;
  background: url(../images/mapbg.jpg) no-repeat center center fixed; 
  background-color: #444;
  background: url(http://mymaplist.com/img/parallax/pinlayer2.png),url(http://mymaplist.com/img/parallax/pinlayer1.png),url(../images/mapbg.jpg) no-repeat center center fixed;  
  background-repeat: no-repeat;
}

非常感谢你的时间。

Tweenlite背景图像保持稳定

0 个答案: