自定义滚动条正确调整大小切换

CustomScrollbar correct resize to toggle?

本文关键字:调整 滚动条 自定义      更新时间:2023-09-26

请告诉我。如何在切换中正确调整customrollbar的大小?现在只工作后点击两次…

http://jsfiddle.net/xmocartx/ktTKe/

    $( document ).ready(function() {
    var open = $('.open'),
    a = $('.location_cont').find('a.open');
    console.log(a.hasClass('active'));
    open.click(function(e){
    e.preventDefault();
    var $this = $(this),
        speed = 300;
    if($this.hasClass('active') === true) {
        $this.removeClass('active').next('.item_in').slideUp(speed);
    } else if(a.hasClass('active') === false) {
                $(".item_in ul").css("resize", true);
        $this.addClass('active').next('.item_in').slideDown(speed);
    } else {
        a.removeClass('active').next('.item_in').slideUp(speed);
        $this.addClass('active').next('.item_in').delay(speed).slideDown(speed);
    }
});
});
$( document ).ready(function() {
    $(".item_in ul").customScrollbar({
    skin: "default-skin", 
    hScroll: false,
    });
    $(document).on("click",function(){
                $(".item_in ul").customScrollbar("resize", true);
    });
});

问题是您的if/else语句从使用$(this)转移到使用对a的模糊引用。

第一个if语句是正确的:if ($this.hasClass('active') === true)

但是下面的else/if是错误的:else if(a.hasClass('active') === false)

应该是else if($this.hasClass('active') === false)

示例:http://jsfiddle.net/ktTKe/3/