Адаптивная проблема макета панели jScroll

0

Надеюсь, кто-то может помочь...

В настоящее время я использую jScrollpane для обработки пользовательских полос прокрутки для моего проекта.

Макет реагирует, и содержимое, заполняющее div, динамически генерируется. Все идет хорошо, за исключением некоторого неуклюжего поведения, когда я изменяю размер моего браузера. Я использую autoReintialise для просмотра любых изменений высоты и ширины. Опять же - работает отлично по большей части.

Моя проблема заключается в том, что когда я перетаскиваю окно браузера и расширяется ширина divs, появляется любой div с примененным к нему jScroll, который довольно сильно мешает. Есть небольшая задержка, а затем догоняет ширину div, поскольку она изменяет размеры - это совсем не текучая.

Мой код находится внутри функции внутри файла javascript, который обрабатывает динамический контент. Это в значительной степени прямая копия из примера с сайта jScrollpane:

function jscroll_refresh() {

var settings = {
    autoReinitialise: true
};
var pane = $(".scroll-pane");
pane.each(
function()
{
    $(this).jScrollPane(settings);

     var api = pane.data('jsp');
            var throttleTimeout;
            $(window).bind(
                'resize',
                function()
                {
                    if (!throttleTimeout) {
                        throttleTimeout = setTimeout(
                            function()
                            {
                                api.reinitialise();
                                throttleTimeout =null;

                            }
                        );
                    }
                }
            );
    });
}

Кто-нибудь еще сталкивается с этой проблемой? Другие предложения для плагина, такого как jScroll? Благодарю!

Теги:
responsive-design
jscrollpane
jquery-jscrollpane

1 ответ

3

Найди его!

Это было что-то в css для jScrollpane, а не javascript.

.scroll-pane{width: 100% !important;height: 93%;overflow: auto;}
.jspContainer{overflow:hidden;position:relative;height:100% !important; width: 100%      !important;}
.jspPane{position:absolute;width: 100%!important;}

Я думаю, что jScroll пытался постоянно вычислять ширину при изменении размера в пикселях - это заставляет проценты и, таким образом, дает мне плавное изменение размера контейнера панели. Больше отставания.

Ещё вопросы

Сообщество Overcoder
Наверх
Меню