CODEWITHSUNDEEP
jquery
Martijn
Martijn

Reputation: 93

Multiple jquery scripts issue

Can you help me out with an jquery issue on my demo site. I have two jquery scripts running. One for a circular content that moves left / right and one for multiple vertical scrollable contents (with jscrollpane) using both scripts on the same page.

When a item is slide open, the text can be scrolled up and down. When I slide to the next content (with the left and right arrow) while not closing the content and return back to previous page the vertical scroller is locked. A page refresh is needed to reset the vertical scroll function.

When first closing the content this issue doesn't show up. Can you help me pointing out the issue. I have tried about anything listed on http://jscrollpane.kelvinluck.com/.

Thanks, Martijn

Upvotes: 0

Views: 156

Answers (1)

chrisn
chrisn

Reputation: 2135

The reason this is happening is because the carousel script you are using is cloning the elements and then adding them to the end of the carousel. Since you are only calling $('.scroll-pane').jScrollPane(); in the initial page load, items with this class that are dynamically created will not be initialized with the jQuery scrollpane plugin.

The only way I've found so far to accomplish what you're looking to do is to modify the carousel script directly, and destroy() and reinitialize the pane every time the new object is created.

I've added a jsFiddle here which shows a working example. The one caveat to it is that since the pane is destroyed and rebuilt, the scrolling position is always moved back to the top when the element has been recreated.

Upvotes: 1

Related Questions