作者热门文章
- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我正在使用 jquery 插件 jQuery custom content scroller
来源: http://manos.malihu.gr/jquery-custom-content-scroller/
它在垂直模式下工作得很好。我可以调用 mCustomScrollbar 并调用更新方法。
请看这个 fiddle : http://jsfiddle.net/Vinyl/2mU7H/1/
但是在水平模式下,我在调用更新方法时遇到了问题。没有内容。
请看这个 fiddle : http://jsfiddle.net/Vinyl/4CW3p/1/
你知道为什么吗?
JS 代码:
$(document).ready(function () {
$("#content").mCustomScrollbar({
horizontalScroll: true,
scrollButtons: {
enable: true
},
theme: "dark"
});
});
$("#button").click(function () {
$("#content").show();
$("#content").mCustomScrollbar("update");
});
$("#button_close").click(function () {
$("#content").hide();
});
CSS代码
#content {
display:none;
overflow:hidden;
text-align:left;
width:150px;
height:150px;
background-color: #666;
color:#fff;
}
HTML代码
<div id="content">
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
<p>lorem ipsum lorem ipsum lorem ipsum lorem ipsum</p>
</div>
<p id="button">Show Content</p>
<p id="button_close">Hide Content</p>
最佳答案
您忘记了 autoExpandHorizontalScroll
设置 :)
$("#content").mCustomScrollbar({
horizontalScroll: true,
scrollButtons: {
enable: true
},
theme: "dark",
advanced: {
autoExpandHorizontalScroll: true
}
});
关于javascript - jQuery 自定义滚动条插件不随 horizontalScroll 更新 : true,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20301903/
我是一名优秀的程序员,十分优秀!