mCustomScrollbar 插件有混乱的麻烦答案

【问题标题】：mCustomScrollbar plugin having confusing troublemCustomScrollbar 插件有混乱的麻烦
【发布时间】：2013-04-10 03:00:30
【问题描述】：

我为带有标题的横幅使用循环插件，标题有一个滚动条，如下图所示。我使用mCustomScrollbar 来设置滚动条的样式。滚动条在第一个标题中工作正常，但是当我在第二个标题中应用它时，滚动条不会出现。出现这种情况的原因是什么，是和cycle有关还是什么？

下图显示了问题：

代码（JavaScript）：

<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
  <script type="text/javascript" src="js/jquery.cycle.all.js"></script>
      <script type="text/javascript">

$(document).ready(function() {
    $('.slider').cycle({
    fx: 'scrollHorz',
    slideExpr: "img:not(.hide)",
    slideResize: false,
    containerResize: false,
    speed: 500,
    timeout: 5000,
    after:  function(curr,next,opts) {
            var index=opts.currSlide;   
            $('#caption div.captionContent:visible').hide();
            $('#caption div.captionContent').eq(index).show();
            }

    });
    });

</script>
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
 <script>
        (function($){
            $(window).load(function(){
                $(".cc").mCustomScrollbar({
                    scrollButtons:{
                        enable:true
                    }
                });
            });
          </script>

HTML：

<div class="banner">
        <div id="caption">
          <div class="captionContent slide5">
            <div class="cc">
              <p>Our clients receive a personalised one on one service from one of our principles to guide them from the initial brief to the final completion of their project.</p>
            </div>
          </div>
          <div class="captionContent"></div>
          <div class="captionContent"></div>
          <div class="captionContent"></div>

        </div>

        <div class="slider">
            <img class="hide" src="images/banner1.jpg" alt="slider 1" />
            <img src="images/banner5.jpg" alt="slider 1" />
            <img src="images/banner2.jpg" alt="slider 1" />
            <img src="images/banner3.jpg" alt="slider 1" />
            <img src="images/banner5.jpg" alt="slider 1" /> 
        </div>
    </div><!-- end banner -->

【问题讨论】：

标签： jquery jquery-ui jquery-plugins mcustomscrollbar

【解决方案1】：

根据我对 mCustomScrollbar 的体验，您需要应用 mCustomScrollbar();在您要单独添加的每个元素上。此外，如果所述元素动态改变尺寸，则每次元素改变尺寸时都需要更新和销毁滚动条。

【讨论】：