Javascript / Jquery compatibility issue

Question

I have a website where I feature a booking engine from cartrawler.

The engine requires to load a certain amount of their own javascripts, however I noted that once I do that my jQuery Simplyscroll is not working anymore. There must be some sort of compatibility issue.

The way I currently load my SimplyScroll is:

 <script type="text/javascript">
 (function($) {
 $(function() {
 $("#scroller").simplyScroll({pauseOnHover: false});
 });
 })(jQuery);
 </script>

After some investigation I figured that the following JS causes the problems and breaks my scroll functionality:

<script type="text/javascript">
document.write('<script type="text/javascript" src="https://ajaxgeo.cartrawler.com/cartrawlerabe/abe/js/ct_abe.js?'+CARTRAWLER.SVNInfo.revision+'"><\/script>');
</script>

Is there any method to prevent the script from breaking my simplyscroll functionality?

Some advise would be highly appreciated - thank you very much.

• Rajan Rawal: This causes when you user more than one javascript libraries along with jQuery and the same are using $ as in jQuery. Solution is as @nhahtdh mentioned.
• Chris Hanson: No guys, that's not the problem here. He's passing jQuery along as a parameter so the $ sign is locally set to jQuery. Are there any errors in the JavaScript console?
• Patrick Lanfranco: Thank you very much nhahtdh! I've tried your method by replacing the "$" with "jQuery" , however I get the same broken result. As mentioned when don't load the specific cartrawler script everything works fine, however once loaded it does not work - additionally when I look in google developer tools I see the following error: Uncaught TypeError: Object [object Object] has no method 'simplyScroll'
• Chris Hanson: Where are you including simplyScroll? It will need to be above the JS you've posted here. Can you verify that simplyScroll exists right after it's imported?
• Patrick Lanfranco: I've had simplyscroll.js loaded directly after my jQuery library, however it seems to work now by loading it directly before the JS. Thank you very much Chris!!!

Answer 1

JavaScript and jQuery are 100% compatible. The libraries you use might not be fully compatible with jQuery. In that case you can use jQuery's $.noConflict in case any other variable hijacked the $