jScrollPane проблема с показом из скрытого div - PullRequest
2 голосов
/ 06 сентября 2011

Я использую http://www.kelvinluck.com/projects/jscrollpane-custom-cross-browser-scrollbars/ как способ создания своей собственной полосы прокрутки, я почти все заработал, но, конечно, есть небольшая проблема, которая мешает мне завершить проект.

КогдаЯ помещаю контейнер div и панель прокрутки div (которая содержит контент) где-то на сайте, он работает нормально, но мне нужно иметь полосу прокрутки в div, который начинается скрытым.Но когда пользователь нажимает, чтобы показать элемент div, он показывает элемент div, но элемент div на панели прокрутки остается скрытым.Теперь я читаю, что мне нужно использовать повторную инициализацию, но я не могу понять, где ее разместить.

Я использую этот код jquery, чтобы скрыть div

// Begin Toggle Hide functie off the extended update view
    jQuery('.social_media_updates_extended_view').hide();

, и эта часть позволяет мне переключатьсямежду разными div.

        jQuery(".update_extend span").css('cursor', 'pointer').click(function() {
            var $this = $(this);
            $('.social_media_updates_extended_view_arrow').not($this.next("div")).fadeOut(200);
            $this.next("div").fadeToggle(200);
        });

            var $container = $(".wrapper_update");
                $container.delegate(".update_extend .btnFadeIn", "click", function(event) {
                    var $view = $(this).closest(".wrapper_update").find(".social_media_updates_extended_view").fadeToggle(200);

                    $container.find(".social_media_updates_extended_view").not($view).fadeOut(200);
            })
// End Toggle Hide functie off the extended update view.

и это часть, которую я использую для вызова полос прокрутки

// Begin Custom Scroll in Div
    jQuery(function(){
        jQuery('.scroll-pane').jScrollPane(
            {reinitialise: true}
        );
    });

Ответы [ 2 ]

1 голос
/ 07 января 2015

Добавить autoReinitialise: true

$(function(){
    $('.scroll-pane').jScrollPane({autoReinitialise: true});
});
1 голос
/ 06 сентября 2011

Попробуйте это

jQuery(".update_extend span").css('cursor', 'pointer').click(function() {
            var $this = $(this);
            $('.social_media_updates_extended_view_arrow')
            .not($this.next("div")).fadeOut(200);
            $this.next("div").fadeToggle(200);
});

var $container = $(".wrapper_update");
$container.delegate(".update_extend .btnFadeIn", "click", function(event){
   var $view = $(this).closest(".wrapper_update")
               .find(".social_media_updates_extended_view")
               .fadeToggle(200, function(){

                     //Here we should check if the container is visible
                     //then reinitialise it
                     if($(this).is(':visible')){
                         jQuery('.scroll-pane').jScrollPane(
                                {reinitialise: true}
                         );
                      }


                });

    $container.find(".social_media_updates_extended_view")
    .not($view).fadeOut(200);
});
...