基本上我有几个绝对位置 div,这些只是选项卡,单击它们会打开并显示内容。
我还有垂直滚动分页(就像 Facebook 的永久滚动一样)。
现在有了选项卡,其中有几个位于页面下方数千像素的位置,这意味着它们正在拉伸(stretch)页面,因此在垂直滚动分页开始之前会有一个巨大的空白。
我试过了
- 最初通过 Jquery 隐藏所有的 div
- 将它们包裹在一个 div 中并 float
- 不同的 z-index
- 设置高度的变化。
我的目标是以某种方式强制浏览器忽略它们。
如果这有帮助:
对于我正在使用的选项卡:TabSlideOut - http://www.building58.com/examples/tabSlideOut-muliple.html
对于滚动分页 - http://www.contextllc.com/dev_tools/jQuery/scrollExtend/latest/jquery.scrollExtend.example.html
最佳答案
我希望我理解你的问题: 您有给定绝对位置的 div,并且您需要能够隐藏它们直到页面上发生事件。
我发现有用的是当我不需要简单的 .hide() 时,将内容“隐藏”在视口(viewport)之外。 (我在 Sprite 图上遇到过这个问题。)
我使用的一种方法是创建一个 CSS 类 .hidden 并调用它:$(selector).addClass('hidden');
.hidden{position: absolute; top: -9999px !important; left: -9999px !important;}
!important 是……嗯,重要。简单地说,如果一个类有 !important,而另一个没有,通常有的优先级高。如果您开始使用 JQuery 来传递 CSS 操作,您可能最终会否决 !important。
然后我将这个类分配给 <div>
我需要让开。我还创建了一个 --[ jsfiddle ]-- 演示将内容带入视口(viewport)的两种方法。
第一个 (aTab) 使用 .hidden 技术。第二个 (bTab) 使用 .slideToggle(),您可以为要加载的下一组内容或与您的 silder 附加组件一起实现。
希望对您有所帮助!
关于jquery - 忽略文档长度中的绝对位置 Div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/14351741/