javascript - div 坚持一个位置 :fixed link?

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:我知道我可以通过将它们都放在 position:fixed 的 div 中来存档平滑的一个，但我想尝试这种技术。

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;