jQuery Tiny Scrollbar 插件 - 刷新时无法显示所有内容答案

【问题标题】：jQuery Tiny Scrollbar plugin - Fails to show all content on refreshjQuery Tiny Scrollbar 插件 - 刷新时无法显示所有内容
【发布时间】：2014-01-08 22:41:55
【问题描述】：

我在一个网站上实现了 Tiny Scrollbar 插件，用于美观的 div 滚动。但是当我在 Safari 或 Chrome 中刷新页面时会发生奇怪的事情。它似乎可以剪辑我的一些内容。页面刷新时会发生什么，这可能使其表现得像这样？请看mettestentoft.dk

我尝试在一个简单的测试页面上使用相同的插件，其中页面刷新会使插件向 div 添加一个“滚动条禁用”类，同时单击链接到同一页面的链接，会让我显示正如它应该。

Tiny Scrollbar 插件演示页似乎没有任何问题，除非我错过了它。

所以我的问题是：我是否必须在 jQuery 方面做一些事情，才能使页面平等地加载到链接页面？

提前谢谢你:)

【问题讨论】：

标签： jquery scrollbar page-refresh

【解决方案1】：

我试过你的代码在结束body标签之前放置js。我在本地机器或本地主机上为我工作，但无法在线解决。

然后我找到了ostrgard的网站参考：http://mettestentoft.dk/erhverv.html

他已经解决了这个问题。我看到并检查了他的代码并在那里找到了解决方案。

只要把这段代码完美地工作：

<script type="text/javascript">
$(window).bind("load", function() {     
    $('#scrollbar1').tinyscrollbar();
});
</script>

【讨论】：

【解决方案2】：

你是如何初始化滚动条插件的？是$('#cases_container').tinyscrollbar();吗？

移除#cases_container div的设置高度。

Nodo.css 行：101。

#cases_container {
    /*height: 383px;*/
    width: 550px;
    /*overflow-x: hidden;*/
    /*overflow-y: hidden;*/
    /*position: relative;*/
    /*top: -200px;*/
    /*left: 250px;*/
}

我假设这样做会搞砸它在页面上的定位，因此创建另一个容器 div 应用所有相对位置等，但将溢出隐藏在其中。

【讨论】：

它确实搞砸了相对位置，但它不能解决问题。也许在我做的简单测试中排除故障会更容易：mettestentoft.dk/test/test_erhverv.html。是的，$('#cases_container').tinyscrollbar();初始化滚动条插件。
无论您刚刚为我修复了什么（chrome 5）。当我单击链接并使用后退按钮时，不要介意滚动条出于某种原因工作。我建议使用更清洁的包装器等清理 div 结构，而不是使用所有负边距和顶部/左侧声明，然后尝试添加滚动条。
刷新页面时会出现滚动条吗？
不是刷新，但由于某种原因，当我转到另一个页面并使用浏览器后退按钮时，它会正确调整。我不知道为什么。所有的 css 看起来都完全相同，这让我认为在将一些 img 加载到 div 之前加载滚动条插件是一个问题。啊！在 body 标记结束之前加载滚动条 javascript。宾果游戏
查清！非常感谢科尔！你提前给我带来了圣诞节……现在我可以让我的客户在假期里离开我了：D

【解决方案3】：

我遇到了类似的问题，shahzad 的解决方案确实对我有用，但只在第一次加载时，从不刷新。这是由 jQuery 加载缓存引起的。解决方案：

$(window).load({noncache: new Date().getTime()},function() { $('#scrollbar1').tinyscrollbar();} );

【讨论】：