Назначение scrollByX и scrollByY для jspDrag в jScrollPane? - PullRequest
0 голосов
/ 21 января 2011

Я реализую jScrollPane для проекта, который включает горизонтальную прокрутку.Клиент хочет, чтобы горизонтальная прокрутка происходила с приращениями, чтобы пользователь мог в основном переходить от слайда к слайду.

Я могу сделать это с помощью стрелок, используя API-интерфейс jScrollPane и scrollByX.Однако проблема заключается в полосе прокрутки, на которой пользователь может щелкнуть, перетащить туда-сюда и прокрутить содержимое таким образом.

Есть ли способ назначить scrollByX (или scrollByY, в этом отношении) в jspDrag, чтобы при перетаскивании пользователем полосы прокрутки прокрутка осуществлялась не непрерывно, а с приращениями?

Заранее спасибо.

1 Ответ

0 голосов
/ 21 января 2011

Вы можете прослушивать событие mouseup после любого события jsp-scroll-x, в котором вы можете выяснить, где находится ближайший элемент, и использовать API-интерфейс jScrollPane для прокрутки до положения этого элемента.Я обновил пример, который вы нашли, чтобы он работал таким образом (как вы заметили, ранее он только прокручивался вперед):

http://www.jsfiddle.net/dzvSC/14/

(очевидно, этот код работает вертикально, но выможно изменить Y на X и верхнюю на левую и т. д.)

var api = $('.scroll-pane').jScrollPane().bind(
    'jsp-scroll-y',
    function(event, scrollPositionY, isAtBottom, isAtTop)
    {
        $(document)
            .unbind('mouseup.jsp-demo')
            .bind(
                'mouseup.jsp-demo',
                function()
                {
                    $(document).unbind('mouseup.jsp-demo');
                    var currentY = api.getContentPositionY(),
                        lastY = 0;
                    api.getContentPane().find('>*').each(
                        function()
                        {
                            var thisY = $(this).position().top,
                                destY;
                            if (thisY > currentY) {
                                destY = currentY - lastY > thisY - currentY ? thisY : lastY;
                                api.scrollToY(destY, true);
                                return false;
                            }
                            lastY = thisY;
                        }
                    );
                }
            );
    }
).data('jsp');

Оригинальный ответ:

Можно делать то, что вы хотите, и ягде-то написал пример.Вы можете найти его в списке рассылки jScrollPane - в данном примере это была вертикальная полоса прокрутки, и она анимировалась до ближайшего изображения, когда вы отпустили полосу прокрутки.Фактический пример был на jsfiddle.net.

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

...