prevent multiple panels from scrolling simultaneously
Greetings,
I am having issues with the localScroll jQuery plugin that I am using in order to slide overflowed content. Currently my code is setup so that when you click a link within the navbar of the Work section the content will slide for every panel simultaneously. (i.e., if I click on the Scan Design link from the work section it takes me to that panel. Then if i click on the web link that content slides up. Then if I click the orange arrow in the nav bar it will take you to the next client, but it will land on their web section rather than starting in the print section.)
Here is a link to view the issue:
http://www.soujohn.com/clients/sil/test/index-work.html
This is what my localScroll script looks like currently.
$('#section-work').localSc
target : 'div#content',
axis : 'xy',
queue : true,
hash : false
});
I know that all the panels are scrolling because my target is set to animate every div with the id of "content". However if i remove "div", and leave it as "#content" then the localScroll animation will only scroll the the first section (Scan Design). Then if you click the right arrow in the navigation bar to access another client the links in that navbar won't animate anything.
Is there any way I can have the localScroll target each #content div which contains the sliding content, but not have it scroll the content simultaneously?
I am having issues with the localScroll jQuery plugin that I am using in order to slide overflowed content. Currently my code is setup so that when you click a link within the navbar of the Work section the content will slide for every panel simultaneously. (i.e., if I click on the Scan Design link from the work section it takes me to that panel. Then if i click on the web link that content slides up. Then if I click the orange arrow in the nav bar it will take you to the next client, but it will land on their web section rather than starting in the print section.)
Here is a link to view the issue:
http://www.soujohn.com/clients/sil/test/index-work.html
This is what my localScroll script looks like currently.
$('#section-work').localSc
target : 'div#content',
axis : 'xy',
queue : true,
hash : false
});
I know that all the panels are scrolling because my target is set to animate every div with the id of "content". However if i remove "div", and leave it as "#content" then the localScroll animation will only scroll the the first section (Scan Design). Then if you click the right arrow in the navigation bar to access another client the links in that navbar won't animate anything.
Is there any way I can have the localScroll target each #content div which contains the sliding content, but not have it scroll the content simultaneously?
One issue is that ids are supposed to be unique. It's a quirk that it's working correctly for div#content. I suggest changing to a class on those divs, then you can use .content, or div.content.
I think that each link is meant to have it's own localScroll setup with the target div defined for it. That would mean that you need to set up multiple ones instead of having this one work for everyything.
I think that each link is meant to have it's own localScroll setup with the target div defined for it. That would mean that you need to set up multiple ones instead of having this one work for everyything.
Premium Content
You need an Expert Office subscription to comment.Start Free Trial