Question

编辑：我现在有这个：http://jsfiddle.net/cGZxv/115/如果我想摆脱容器div并只使用“文档”怎么办？有更清洁的方法吗？

我一直在玩我在网上发现的一些代码，而且我差点把它放在我想要的地方。我只是无法弄清楚如何完成最后一部分。在这个JSfiddle中：

  $(document).ready(function(){
  $('div.container').mousemove(function(e){
        var x = e.pageX - this.offsetLeft;
      if (x <= 400) {
          x2=x*0.2
          $('div.box').css({'right': x2}); 
      }
       var y = e.pageY - this.offsetTop;
      if (y <= 400) {
           y2=y*0.2
          $('div.box').css({'bottom': y2}); 
      }
  });
});

我想要做的是将“TEST BOX”捕捉到容器DIV的中心，并且在鼠标移动时，基本上“绕轨道”中心。如果您将鼠标移动到圆圈中，则会获得所需的移动，但该框位于错误的位置。

提前致谢！

Answer 1

这是用于将其放入正文而不是容器的JS。

$(document).ready(function(){
    $(window).mousemove(function(e){
        var x = e.pageX-window.innerWidth/2;
        if (x <= 400) {
            x2=x*0.2
            x3=x2+window.innerWidth/2
            $('div.box').css({'right': x3}); 
        }
        var y = e.pageY-window.innerHeight/2;
        if (y <= 400) {
            y2=y*0.2
            y3=y2+window.innerHeight/2
            $('div.box').css({'bottom': y3}); 
        }
    });
});

然后我改变了CSS以使其从中间开始：

.box { width: 50px; height: 50px; border: 1px #000 solid; position: absolute; margin:-25px 0 0 -25px;bottom:50%;right:50%;}

这是JSFiddle。

Div移动到鼠标移动中心（）

1 个答案: