Foren / Cotonti / Support / Ajax in Plugins?

ez
#24870 5. Juni 2010, 15:25
Hi scriptor,

// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED)
if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
	jQuery(function($) {
		$("a[rel^='lightbox']").slimbox({/* Put custom options here */}, null, function(el) {
			return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
		});
	});
}

this code (inside slimbox.js) runs when your page is loaded... but since you load images later (ajax), these images does not go with the initial load... (so slimbox will not fire !, on the ajax images)

run this code again.. (Warning: initial images get hit twice maybe... ??, i do not know what would happen... you should test it on a normal image and on a ajax image)


Maybe do it like this SAFER WAY

your ajax image:
In the ajax images do
<a href="images/image-1.jpg" rel="ajxlightbox" title="my caption">image #1</a>

The code that you should run AFTER the ajax image is loaded.
// AUTOLOAD CODE BLOCK (MAY BE CHANGED OR REMOVED)
if (!/android|iphone|ipod|series60|symbian|windows ce|blackberry/i.test(navigator.userAgent)) {
	jQuery(function($) {
		$("a[rel^='ajxlightbox']").slimbox({/* Put custom options here */}, null, function(el) {
			return (this == el) || ((this.rel.length > 8) && (this.rel == el.rel));
		});
	});
}


You can also use id's or something.. just change the JQuery selector

// $("a[rel^='lightbox']")
$("#idofmyajaximage")

In the ajax images do this
<a href="images/image-1.jpg" id="#idofmyajaximage" rel="lightbox" title="my caption">image #1</a>



ANYWAY you are on your way now with Help ..

greetz, EZ
==- I say: Keep it EZ -==