[SOLVED] Javascript conflict between Showtime and Gallery

Have a question or a suggestion about a 3rd party addon module or plugin?
Let us know here.
Post Reply
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

[SOLVED] Javascript conflict between Showtime and Gallery

Post by CMSmonkey »

Hi everyone,
I have a webpage running 2 different scripts. When I added the Gallery module to the page, the Showtime module stopped working.

Below are the scripts. Is there any way to easily alter the code so that they don't conflict?

SHOWTIME MODULE

Code: Select all

<__script__ type="text/javascript">
        
        $(document).ready(function(){
			var lastslide=0;
			$('ul#slides_7').cycle({ 
				fx: 'curtainX',
				speed:    1000, 
				timeout:  5000,
 
				pagerEvent: 'mouseover',
		
				fastOnEvent: false,
				pause: 1,
				pauseOnPagerHover: 1,
				prev: '#prev_7',
				next: '#next_7' 
			});

            $("#slideshow_7").hover(function() {
                $("ul#prevnextnav_7").fadeIn();
            },
                function() {
                $("ul#prevnextnav_7").fadeOut();
            });
           
                });

        
        </__script>
GALLERY MODULE

Code: Select all

<__script__ type="text/javascript">
  $(function() {
    var galleries = $('.ae-gallery').aeGallery({
      loader_image: 'modules/Gallery/templates/ae-gallery/loader.gif',
      slideshow: {
        autostart: false,
        speed: 4000,
        start_label: 'Start',
        stop_label: 'Stop',
        stop_on_scroll: false
      }
    });
  });
</__script>
Thank you in advance for your help!
Last edited by CMSmonkey on Thu Jul 09, 2015 3:14 pm, edited 1 time in total.
User avatar
velden
Dev Team Member
Dev Team Member
Posts: 3497
Joined: Mon Nov 28, 2011 9:29 am

Re: Javascript conflict between Showtime and Gallery modules

Post by velden »

You probably have these problems because both modules load a jQuery library.

I usually prefer to include a jQuery library myself in the <head> of the page template(s) and don't allow the modules to include it. (Don't know about Showtime).
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

Re: Javascript conflict between Showtime and Gallery modules

Post by CMSmonkey »

Thanks for the response. How can I resolve this? I am not too versed in javascript.

I looked into the page source and this is in the head tag:

Code: Select all

<!--LOAD SHOWTIME jQuery-->
<__script__ type="text/javascript" src="http://www.mysite.com/modules/Showtime/templates/jquery/jquery-1.4.2.js" ></__script>
<__script__ type="text/javascript" src="http://www.mysite.com/modules/Showtime/templates/jquery/jquery.cycle.all.min.js" ></__script>
<!--END SHOWTIME-->
<!-- Gallery/AE-Gallery -->
<link rel="stylesheet" href="http://www.mysite.com/modules/Gallery/templates/css/AE_Gallery.css" type="text/css" media="screen" />
<__script__ type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></__script>
<__script__ type="text/javascript" src="modules/Gallery/templates/ae-gallery/jquery.ae-gallery.min.js"></__script>

<__script__ type="text/javascript">
  $(function() {
    var galleries = $('.ae-gallery').aeGallery({
      loader_image: 'modules/Gallery/templates/ae-gallery/loader.gif',
      slideshow: {
        autostart: false,
        speed: 4000,
        start_label: 'Start',
        stop_label: 'Stop',
        stop_on_scroll: false
      }
    });
  });
</__script>
The Showtime script below is within the body:

Code: Select all

   <__script__ type="text/javascript">
        
        $(document).ready(function(){
			var lastslide=0;
			$('ul#slides_7').cycle({ 
				fx: 'curtainX',
				speed:    1000, 
				timeout:  5000,
 
				pagerEvent: 'mouseover',
		
				fastOnEvent: false,
				pause: 1,
				pauseOnPagerHover: 1,
				prev: '#prev_7',
				next: '#next_7' 
			});

            $("#slideshow_7").hover(function() {
                $("ul#prevnextnav_7").fadeIn();
            },
                function() {
                $("ul#prevnextnav_7").fadeOut();
            });
           
                });

        
        </__script>
staartmees
Power Poster
Power Poster
Posts: 1049
Joined: Wed Mar 19, 2008 4:54 pm

Re: Javascript conflict between Showtime and Gallery modules

Post by staartmees »

This problem has already been solved in this forum. In the Showtime module I changed the javascript template, in my case Slimbox, by disabeling jquery.min.js

Code: Select all

<!-- <__script__ type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></__script> -->
<__script__ type="text/javascript" src="modules/Gallery/templates/slimbox/js/slimbox2.js"></__script>
CMSmonkey
Power Poster
Power Poster
Posts: 290
Joined: Thu Nov 27, 2008 4:58 pm

Re: Javascript conflict between Showtime and Gallery modules

Post by CMSmonkey »

staartmees wrote:This problem has already been solved in this forum. In the Showtime module I changed the javascript template, in my case Slimbox, by disabeling jquery.min.js

Code: Select all

<!-- <__script__ type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></__script> -->
<__script__ type="text/javascript" src="modules/Gallery/templates/slimbox/js/slimbox2.js"></__script>
Hi Staartmees,
I saw some threads on this issue that didn't help; this solution I must have overlooked. Thanks so much for your help.
Post Reply

Return to “Modules/Add-Ons”