Javascript NiceScroll 调整大小函数

标签 javascript jquery scrollbar nicescroll

我正在使用 jQuery 插件版本 3.10 来使用自定义滚动条。我有许多水平幻灯片,每个幻灯片都使用自己的自定义滚动条。我想包含扩展文本的 javascript .onclick 函数。但是,当我展开文本并溢出时,滚动条不会出现。我使用以下代码来选择应具有 onclick 函数的标题(标签“h3”,类“click”):

function toggleNext(el) {
 var next=el.nextSibling;
 while(next.nodeType != 1) next=next.nextSibling;
 next.style.display=((next.style.display=="none") ? "block" : "none");
}

function getElementsByTagAndClassName(tag,cname) {
 var tags=document.getElementsByTagName(tag);
 var cEls=new Array();
 for (i=0; i<tags.length; i++) {
  var rE = new RegExp("(^|\s)" + cname + "(\s|$)");
   if (rE.test(tags[i].className)) {
   cEls.push(tags[i]);
   }
  }
 return cEls;
}
function toggleNextByTagAndClassName(tag,cname) {
 var ccn="clicker";
 clickers=getElementsByTagAndClassName(tag,cname);
 for (i=0; i<clickers.length; i++) {
  clickers[i].className+=" "+ccn;
  clickers[i].onclick=function() {toggleNext(this)}
  toggleNext(clickers[i]);
 }
}
window.onload=function(){toggleNextByTagAndClassName('h3','click')}

HTML 示例:

<article class="slide" id="lorem">
<div class="inner">
<h3 class="click">Lorem Ipsum</h3>
<div class="content">
<p>Sample text, is sample text, is sample text</p>
</div>

从之前的研究中我知道我必须从niceScroll jQuery插件中调用调整大小函数,如下所示。

$(name-of-div).getNiceScroll().resize()

我尝试使用以 div 名称作为内容的调整大小函数,但这不会产生预期的结果。如果可以的话请帮忙。我不确定如何将两者一起实现。

最佳答案

不确定是否理解发生了什么,但我遇到了类似的问题。尝试在 setTimeout 中使用 resize()。

请注意,“name-of-div”必须是卷轴容器的名称。 jQuery 代码如下所示:

setTimeout(function(){
  $('name-of-div').getNiceScroll().resize()
}, 500);

我使用 500 作为示例,但是如果您的 div 文本在动画时展开,则必须使用大于 div 动画的数字,当然,代码必须在所有交互之后执行

关于Javascript NiceScroll 调整大小函数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23392528/

相关文章:

css - 如何在 bootstrap3 中制作带有图像缩略图的水平滚动 div

javascript - React/AntDesign 如何使行可拖动? (表格拖动排序)

javascript - 如何在 HighChart 中默认关闭某些指定的系列?

javascript - 判断鼠标是否从一个 div 拖到另一个

c++ - 制作一个可滚动的小部件区域

HTML 滚动条一半工作一半不工作

javascript - datejavascript 将数值转换为时间值

javascript - Bootstrap 将导航栏固定在 div 内

javascript - 在输入父级之外附加一个 div

javascript - 如何根据标签值对数据表进行排序