使用数据属性的引导词缀仅适用于页面刷新

Question

我正在使用通过数据属性的引导词缀功能来处理Rails4应用程序。

我使用的数据属性是这样的：

<div data-spy="affix" data-offset-top="300" data-offset-bottom="615"> 
...stuff... 
...stuff... 
...stuff... 
</div> 

我对词缀类只CSS如下：

.affix { 
    width: 255px; 
    margin-top: -300px; 
} 

.affix-bottom { 
    position: relative; 
} 

.affix-top { 
    position: relative; 
} 

一切完美的作品，当我重新加载页面，除了当我最初从我的Web应用程序的另一个页面导航到它时，它不起作用。

似乎其他人在这方面遇到了麻烦，而且它也是一个涡轮问题。尝试所有的方法，但没有任何工作： 尝试使用jquery-turbolinks什么都没有 所以我只是最终删除turbolinks所有在一起..宁愿使用turbolinks，如果我能得到这个工作，如果有人知道我可以做到这一点。 有关为什么会发生这种情况的任何想法？

Answer 1

我只是删除turbolinks，使这项工作。找不到与Turbolinks合作的方法。

Answer 2

我认为你需要在你的CSS中为.affix元素设置顶级属性。阴性切缘可能会导致词缀偏移计算问题 -

.affix{ 
    top: 300px; /* Set the top position of pinned element */ 
} 

检查这个URL，可能就会对你有所帮助 - http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-affix.php

Answer 3

我最终删除数据属性和初始化词缀页面已经加载（我用jquery.turbolinks），像这样经过：

$(document).ready -> 
    $('#myAffix').affix({ 
     offset: 
     top: 100, 
     bottom: 0 
    }) 

（请原谅我的CoffeeScript！）

如果您需要设置偏移等与dataattributes（即你有不同的偏移量为您网站上的每个词缀）。例如，您可以创建自己的数据属性并使用$('#myAffix').data('offset-top')获取它们。