paulonline2501 Posted April 9, 2012 Share Posted April 9, 2012 hi all, im having another problem with a site that has several scripts on it. i have some scripts that handle scroll bars and some scripts that run Lightbox2. i call the scroll bar and lightbox2 scripts in the header and then initiate the scroll bar in the body. if i run the scripts seperately there is no problem i.e: if i run them on seperate pages theres no problem. when i put the scripts on the same page [with the lightbox scripts last] then only the lighbox script works. the scrollbars just show as normal scrollbars. i tried putting the lighbox scripts first but then neither functionality worked. i'm hoping someone out there can help with this problem.is this some kind of conflict? could the call to the scrollbars be set to noconflict? i call the scripts like so: <!-- SCROLL BAR SCRIPTS--><script type="text/javascript" src="../_js/jquery.min.js"></script><script type="text/javascript" src="../_js/jquery.mousewheel.js"></script><script type="text/javascript" src="../_js/jquery.jscrollpane.min.js"></script> <!-- LIGHTBOX SCRIPTS--><script type="text/javascript" src="js/prototype.js"></script><script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script><script type="text/javascript" src="js/lightbox.js"></script> </head><body><script type="text/javascript" id="sourcecode">$(function(){$('.scroll-pane').jScrollPane({//showArrows: true,//arrowScrollOnHover: true,//mouseWheelSpeed: 20verticalDragMaxHeight: 30});$('.pics').jScrollPane({//showArrows: true,//arrowScrollOnHover: true,//mouseWheelSpeed: 20verticalDragMaxHeight: 30});});</script> to see what it should look like you can see the page with just the scrollbars here:http://jt-design.paulyouthed.com/test/ ...the page with just the light box is here:http://jt-design.pau...-pop-out003.php ...and finally, the page where im trying to run both scripts at the same time is here:http://jt-design.pau...-pop-out005.php in the last one the scroll bars dont render but the lightbox does work. thanks for reading and regards. Link to comment Share on other sites More sharing options...
thescientist Posted April 9, 2012 Share Posted April 9, 2012 I feel like this has been covered before. Are you aware of jQuery noConflict?http://api.jquery.com/jQuery.noConflict/ Link to comment Share on other sites More sharing options...
paulonline2501 Posted April 9, 2012 Author Share Posted April 9, 2012 hi thescientist, i tried running noconflict on the scrollbar script but it didnt seem to make any difference....not sure im running it correclty.might try it again, and see if i get anywhere. thanks. Link to comment Share on other sites More sharing options...
thescientist Posted April 10, 2012 Share Posted April 10, 2012 you realize you have to refere to jquery differently, too, right? make sure you read the reference page in its entirety. In fact, it's for this reason that jQuery formally advises people to use jQuery instead of the dollar sign. Link to comment Share on other sites More sharing options...
paulonline2501 Posted April 12, 2012 Author Share Posted April 12, 2012 (edited) hello theScientist, i read the instructions and managed to get the script working.it didnt work at first but when i put the script lightbox scripts first it worked.for any one who want to see the code, here you are: <!-- LIGHTBOX SCRIPTS--><script type="text/javascript" src="js/prototype.js"></script><script type="text/javascript" src="js/scriptaculous.js?load=effects,builder"></script><script type="text/javascript" src="js/lightbox.js"></script> <!-- SCROLL BAR SCRIPTS--><script type="text/javascript" src="../_js/jquery.min.js"></script><script type="text/javascript" src="../_js/jquery.mousewheel.js"></script><script type="text/javascript" src="../_js/jquery.jscrollpane.min.js"></script> </head><body><script type="text/javascript" id="sourcecode">$.noConflict(); jQuery(document).ready(function($) { $(function(){$('.scroll-pane').jScrollPane({//showArrows: true,//arrowScrollOnHover: true,//mouseWheelSpeed: 20verticalDragMaxHeight: 30 }); $('.pics').jScrollPane({//showArrows: true,//arrowScrollOnHover: true,//mouseWheelSpeed: 20verticalDragMaxHeight: 30 });});});</script> the code i added to get it working was: $.noConflict(); jQuery(document).ready(function($) { // the code that's not working goes here}); Edited April 12, 2012 by as_bold_as_love Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now