Question

我编写了一个jQuery代码来跟踪链接的位置（position:fixed），然后将其用作DIV（位于其下方）的位置。因此，当用户滚动时，固定的链接（top:0; left:0; right:0;）将自动粘到顶部，我的jQuery代码使div在移动时跟随链接，但它是滞后的。

<a href="link" id="link" style="position:fixed;top:0;left:0;right:0;">Link</a>
<div id="divsticktolink" style="width:200px;height:200px;position:absolute;">Test</div>

jQuery代码：

$(window).scroll(function () { 
  var link = $("#link");  
  var position = link.offset();
  var top = position.top + 10;
     $('#divsticktolink').css('left' , position.left + 'px');
     $('#divsticktolink').css('top' , top + 'px');
});

如何解决滞后部分？

P / S：我知道我可以通过将它们放在div position:fixed中来存档，但我想尝试这种技术。

Answer 1

我不知道这是否会解决滞后现象，但你可以通过组合这两行来提高效率......

 $('#divsticktolink').css('left' , position.left + 'px');
 $('#divsticktolink').css('top' , top + 'px');

进入这个...

 $('#divsticktolink').css({
                            'left' : position.left + 'px',
                            'top' : top + 'px'
 });

var声明也可以合并，但它可能没有太大的影响......

var link = $("#link"),  
    position = link.offset(),
    top = position.top + 10;

div坚持一个位置：固定链接？

1 个答案: