Results 1 to 3 of 3

Thread: Script Conflicts

  1. #1
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Script Conflicts

    I'm running this script for a tooltip slideshow:

    Code:
    var tooltipshow = {
    	init: function(id, category, effects){
    		this.id = $("#" + id);
    		this.category = category;
    		this.effects = effects;
    		this.speed = effects.speed || 500;
    		
    		var me = this;
    		$("#" + id + " a").each(function(){
    			$(this).hover(
    				function(){
    					me.createToolTip(me.category[$(this).data("category")]);
    				},
    				function(){
    					me.tooltip.remove();
    					me.currimg = 0;
    					clearTimeout(me.counter);
    				});
    		});
    		
    		return this; //pass this to the init caller variable;
    	},
    	createToolTip: function(category){
    		this.tooltip = $("<div></div>")
    			.addClass("tip");
    		this.images = new Array();
    		var me = this;
    		$.each(category, function(key, value){
    			me.images[key] = $("<img></img>")
    				.attr({
    					src: value,
    					width: 50,
    					height: 50
    				});
    			me.tooltip.append(me.images[key]);
    		});
    		
    		$(document).mousemove(function(e){
    			var x = (e.pageX || e.clientX + document.body.scrollLeft) + 10;
    			var y = (e.pageY || e.clientY + document.body.scrollTop) + 10;
    			
    			me.tooltip.css({
    				top: y + "px",
    				left: x + "px"
    			});
    		});
    		
    		$("body").append(this.tooltip);
    		this.currimg = 0; // the current image
    		this.counter = setTimeout(function(){ me.slideshow(); }, this.speed);
    	},
    	slideshow: function(){
    		this.images[this.currimg].animate({'opacity': 0}, 500);
    		this.images[(this.currimg+1 > this.images.length-1) ? 0 : this.currimg+1].animate({'opacity': 1}, 500);
    		this.currimg++;
    		if(this.currimg > this.images.length-1){
    			this.currimg = 0;
    		}
    		
    		var me = this;
    		this.counter = setTimeout(function(){ me.slideshow(); }, this.speed+500);
    	}
    }
    The tooltip slideshow also requires a second script that is stored here.


    Somewhere in the tooltip scripts there is a conflict with the Lightbox Image Viewer 2.03a causing the viewer to stop working when the tooltip scripts are installed. Can anyone help me solve the issue?

    Thanks in advance
    Last edited by jscheuer1; 07-05-2011 at 07:40 PM. Reason: format code

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    30,495
    Thanks
    82
    Thanked 3,449 Times in 3,410 Posts
    Blog Entries
    12

    Default

    Using jQuery for the tip and Prototype for the Lightbox doesn't make much sense. Prototype and jQuery are script libraries - sets of routines for automating common javascript tasks and effects. The two can coexist sometimes, depending upon versions used and upon the scripts that are using them. But I think that it might not work out in this case. In any case it's usually at least a little complicated to work out even when it can be.

    You could use Slimbox 2:

    http://www.digitalia.be/software/slimbox2

    for the lightbox, it already uses jQuery. So there would be no conflict of that sort (between libraries). In fact you could and probably should only need to use one copy of jQuery for the page.
    Last edited by jscheuer1; 07-06-2011 at 07:44 AM. Reason: English Usage
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

  3. #3
    Join Date
    Jun 2011
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Tried it. It worked. You rock!

Bookmarks

Posting Permissions

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