Yasir Ahmed Yasir Ahmed - 4 months ago 29
Javascript Question

jscroll pane multiple div with same class

I have an html page that contain multiple divs with same class name.
i-e

<div class='some-class'>
<div class='some-class'>
<div class='some-class'>


I have used
jscroll
pane for nice and fancy
scrollbar
.
it is working fine.
but
scrollToBottom()
function isn't working correctly.
the scroll of only first div is setting to bottom remaining
div
s scroll-bar are remain same to top.

here are my functions

var scrollPane = $('.some-class').jScrollPane().data('jsp');
scrollPane.scrollToBottom();

Answer

If you need that ALL of your divs with scroll go to down, iterate through them:

var scrollPanes = $('.some-class');
scrollPanes.each(function() {
    var jsp = $(this).jScrollPane().data('jsp');
    jsp.scrollToBottom();
});

If you need that only ONE of your divs with scroll go to down, you need to mark the divs with another class (or id, or custom attribute), and apply only to it:

<div class="some-class only-this"></div>
<div class="some-class only-that"></div>
<div class="some-class only-self"></div>

With JS:

var scrollPane = $('.some-class.only-this').jScrollPane().data('jsp');
scrollPane.scrollToBottom();