Javascript / jQuery粘性而不使用css位置：已修复

我正在寻找一个粘性标题的Javascript / jQuery插件，它不会将元素的样式切换到固定的位置。 通常，我正在使用这个http://stickyjs.com/ ，它工作正常。

我正在使用jQuery动画的网站上工作，我的一个div有一个宽度为100％的粘性标题。 但是当我向左移动时（例如），宽度：100％现在基于窗口的宽度而不是他的容器。

那么，是否有一个现有的插件与其他插件做同样的事情，但保持位置：相对并计算scrollTop以应用为我的粘贴标题的margin-top？

Answer 1

所以，我解决了我的问题！ 这是我的javascript代码：

您必须设置顶部：默认为0px

 function relative_sticky(id, topSpacing){ if(!topSpacing){ var topSpacing = 0; } var el_top = parseFloat(document.getElementById(id).getBoundingClientRect().top); el_top = el_top - parseFloat(document.getElementById(id).style.top); el_top = el_top * (-1); el_top = el_top + topSpacing; if(el_top > 0){ document.getElementById(id).style.top = el_top + "px"; } else{ document.getElementById(id).style.top = "0px"; } } window.onscroll = function(){ relative_sticky("your_element_id", 10); } 

它在IE中不是很流畅，所以我添加一个延迟：

 var delay = (function(){ var timer = 0; return function(callback, ms){ clearTimeout (timer); timer = setTimeout(callback, ms); }; })(); window.onscroll = function(){ if(BrowserDetect.browser == "Explorer" || BrowserDetect.browser == "Mozilla"){ // or your own way to detect browser delay(function(){ relative_sticky("admin_users_head", 31); }, 200); } else{ relative_sticky("admin_users_head", 31); } }