Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New Coder
    Join Date
    Dec 2012
    Location
    Spain
    Posts
    24
    Thanks
    15
    Thanked 1 Time in 1 Post

    Question jQuery conflict - Lightbox Gallery & Rotating banner

    Hi, I am trying to find the conflict on my php page.
    I have the rotating banner on top of the page and the lightbox gallery as content. No problems on the Gallery, but the Banner is no longer present.

    I have tried to put in $.noConflict(); or even start with <script>jQuery.noConflict();</script> right under the jquery script and replace all $ with the actual word jQuery - but nothing seems to do the job.

    Is there anyone who know what else I can try?

    Code:
    <script type="text/javascript">  // banner slider script  
      jQuery(document).ready(function() {
    			jQuery('#slider').s3Slider({
    				timeOut: 6000
    			});
    		});
    	</script>
    The Gallery comes with a remote files & jQuery plugin, but the actual script is:

    Code:
     
    jQuery(document).ready(function(){
    // Executed once all the page elements are loaded
    
    	var preventClick=false;
    	
    	jQuery(".pic a").bind("click",function(e){
    		/* This function stops the drag from firing a click event and showing the lightbox */
    		if(preventClick)
    		{
    			e.stopImmediatePropagation();
    			e.preventDefault();
    		}
    	});
    
    	jQuery(".pic").draggable({
    		/* Converting the images into draggable objects */
    		containment: 'parent',
    		start: function(e,ui){
    			/* This will stop clicks from occuring while dragging */
    			preventClick=true;
    		},
    		
    		stop: function(e, ui) {
    			/* Wait for 250 milliseconds before re-enabling the clicks */
    			setTimeout(function(){ preventClick=false; }, 250);
    		}
    	});
    
    
    	jQuery('.pic').mousedown(function(e){
    								 
    		/* Executed on image click */
    		
    		var maxZ = 0;
    		
    		/* Find the max z-index property: */
    		
    		jQuery('.pic').each(function(){
    			var thisZ = parseInt($(this).css('zIndex'))
    			if(thisZ>maxZ) maxZ=thisZ;
    		});
    		
    		/* Clicks can occur in the picture container (with class pic) and in the link inside it */
    		if(jQuery(e.target).hasClass("pic"))
    		{
    			/* Show the clicked image on top of all the others: */
    			jQuery(e.target).css({zIndex:maxZ+1});
    		}
    		else jQuery(e.target).closest('.pic').css({zIndex:maxZ+1});
    	});
    	
    	/* Converting all the links to a fancybox gallery */
    	jQuery("a.fancybox").fancybox({
    		zoomSpeedIn: 300,
    		zoomSpeedOut: 300,
    		overlayShow:false
    	});
    	
    	/* Converting the share box into a droppable: */
    	jQuery('.drop-box').droppable({
    		hoverClass: 'active',
    		drop:function(event,ui){
    			/* Fill the URL text field with the URL of the image. */
    			/* The id of the image is appended as a hash #pic-123 */
    			jQuery('#url').val(location.href.replace(location.hash,'')+'#'+ui.draggable.attr('id'));
    			jQuery('#modal').dialog('open');
    		}
    	});
    
    	/* Converts the div with id="modal" into a modal window  */
    	jQuery("#modal").dialog({
    		bgiframe: true,
    		modal: true,
    		autoOpen:false,
    		buttons: {
    				Ok: function() {
    					jQuery(this).dialog('close');
    				}
    			}
    	});
    	
    	if(location.hash.indexOf('#pic-')!=-1)
    	{
    		/* Checks whether a hash is present in the URL */
    		/* and shows the respective image */
    		jQuery(location.hash+' a.fancybox').click();
    	}
    	
    });
    Hopefully you can see what I am overlooking, picked my brain all day yesterday but can't find the issue.
    Last edited by Joycie; 06-11-2013 at 01:32 PM. Reason: changed the banner, got rid of second jQuery

  • #2
    The fat guy next door VIPStephan's Avatar
    Join Date
    Jan 2006
    Location
    Halle (Saale), Germany
    Posts
    8,479
    Thanks
    6
    Thanked 981 Times in 954 Posts
    Have you read this thread? I suggest you do so. And then please post your HTML, too, and any JS error the browser’s error console spits out.

  • #3
    New Coder
    Join Date
    Dec 2012
    Location
    Spain
    Posts
    24
    Thanks
    15
    Thanked 1 Time in 1 Post
    Thank you for your reply!

    I know it is difficult to have multiple jQuery's collaborating... I have now changed the banner to a fixed one to prevent from any more frustrations.
    As a new coder, I guess I am a little out of my league trying to overcome these kind of difficulties...but it was worth a shot!

    Thanks again for your link... as we try, read and ask around, we learn!


  •  

    Tags for this Thread

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •