Slideshow Vs lightbox

**jscheuer1** · 04-30-2010, 01:34 AM

I have an IE 7 test environment on another machine. When I get some time I will bring it back online and test your page in it. The page should work in IE 7. It would help if you could put your test page online somewhere, otherwise I will have to publish it somewhere just to test it.

The code (highlighted):

Code:

slides.onclick = "this.title = this.getElementsByTagName('img')[0].title; this.rel = 'lightbox'; myLightbox.start(this); return false;";

Should never be used with the version of Lightbox you are using. It will always give an error regardless of browser. It's just that most browsers don't report errors as readily as IE does. You should use (for all browsers):

Code:

 slides.onclick = "this.title = this.getElementsByTagName('img')[0].title; this.rel = 'lightbox';";

We can make a branch for IE though:

Code:

slides.onclick = "this.title = this.getElementsByTagName('img')[0].title; this.rel = 'lightbox';";
/*@cc_on @*/
/*@if(@_jscript_version >= 5)
slides.onclick = "open(this.href, '_blank'); return false;";
@end @*/

About the page not appearing sometimes, do you mean the entire page, or just the Lightbox? It wouldn't hurt to validate your page:

http://validator.w3.org/

**jscheuer1** · 04-30-2010, 04:39 AM

In my IE 7 test environment the page wouldn't show up at all.

After I validated the page - not completely, just some of the major stuff - it worked in IE 7:

http://home.comcast.net/~jscheuer1/s..._test/test.htm

**sanduwa** · 05-01-2010, 10:11 AM

It's working perfectly in IE8.

You are a genius Mr.John
Thank you very much. You helped me lot.
Thank you again.

**madu** · 05-01-2010, 06:10 PM

jscheuer1, i'm continuing from,
http://www.dynamicdrive.com/forums/s...t=54023&page=2

this code is not working as i want,

Code:

var slides=[]; //FIRST SLIDESHOW
//configure the below images and descriptions to your own. 
slides[0] = ["photo1.jpg", "Kissing Fools", "photo1_lrg.jpg"];
slides[1] = ["photo2.jpg", "Seated Woman", "photo2_lrg.jpg"];
slides[2] = ["photo3.jpg", "The Dog Lovers", "photo3_lrg.jpg"];
slides[3] = ["photo4.jpg", "Standing Woman", "photo4_lrg.jpg"];
slides[4] = ["photo5.jpg", "John, Mary and Jesus", "photo5_lrg.jpg"];

Code:

<script type="text/javascript">
(function(ar){
	var d = document.createElement('div'), a = document.createElement('a'), a1;
	a.rel = 'lightbox[Brussels]';
	d.style.display = 'none';
	for(var i = 0; i < ar.length; ++i){
		a1 = a.cloneNode(true);
		a1.title = ar[i][1];
		a1.href = ar[i][2];
		d.appendChild(a1);
	}
	document.body.insertBefore(d, document.body.firstChild);
})(slides);
</script>

Place that right after your opening <body> tag. This assumes that the Swiss Army scripts were installed as instructed on its demo page, with the array of slides in the head of the page.

what i want is lightbox slideshow. not lightbox. when i Place this code as you said it's working as normal lightbox but not like lightbox slideshow. i want to perform lightbox slideshow.
( sorry for being late)

**jscheuer1** · 05-01-2010, 11:37 PM

Originally Posted by madu

jscheuer1, i'm continuing from,
http://www.dynamicdrive.com/forums/s...t=54023&page=2

this code is not working as i want,

Code:

var slides=[]; //FIRST SLIDESHOW
//configure the below images and descriptions to your own. 
slides[0] = ["photo1.jpg", "Kissing Fools", "photo1_lrg.jpg"];
slides[1] = ["photo2.jpg", "Seated Woman", "photo2_lrg.jpg"];
slides[2] = ["photo3.jpg", "The Dog Lovers", "photo3_lrg.jpg"];
slides[3] = ["photo4.jpg", "Standing Woman", "photo4_lrg.jpg"];
slides[4] = ["photo5.jpg", "John, Mary and Jesus", "photo5_lrg.jpg"];

Code:

<script type="text/javascript">
(function(ar){
	var d = document.createElement('div'), a = document.createElement('a'), a1;
	a.rel = 'lightbox[Brussels]';
	d.style.display = 'none';
	for(var i = 0; i < ar.length; ++i){
		a1 = a.cloneNode(true);
		a1.title = ar[i][1];
		a1.href = ar[i][2];
		d.appendChild(a1);
	}
	document.body.insertBefore(d, document.body.firstChild);
})(slides);
</script>

Place that right after your opening <body> tag. This assumes that the Swiss Army scripts were installed as instructed on its demo page, with the array of slides in the head of the page.

what i want is lightbox slideshow. not lightbox. when i Place this code as you said it's working as normal lightbox but not like lightbox slideshow. i want to perform lightbox slideshow.
( sorry for being late)

If you want more help:

Please post a link to a page on your site that contains the problematic code so we can check it out.

**madu** · 05-02-2010, 01:11 AM

i have no link to post for this. because i'm testing it by locally.
simply i try to integrate
slideshow
http://www.dynamicdrive.com/dynamicindex14/swissarmy/index.htm
and
lightbox-slideshow
http://www.justinbarkhuff.com/lab/lightbox_slideshow/

let's take the link that you have published for sanduwa,
http://home.comcast.net/~j scheuer1/side/vfs/test_test/test.htm
can you integrate this with lightbox-slideshow and publish?
thanx

**jscheuer1** · 05-02-2010, 02:58 PM

Originally Posted by madu

i have no link to post for this. because i'm testing it by locally.
simply i try to integrate
slideshow
http://www.dynamicdrive.com/dynamicindex14/swissarmy/index.htm
and
lightbox-slideshow
http://www.justinbarkhuff.com/lab/lightbox_slideshow/

let's take the link that you have published for sanduwa,
http://home.comcast.net/~j scheuer1/side/vfs/test_test/test.htm
can you integrate this with lightbox-slideshow and publish?
thanx

sanduwa at least provided me with a 'best effort'. That example was fine for resolving the issues that it had and showed that sanduwa was willing to make the effort to set this up. With only two images, it wouldn't be all that great for what you are trying.

Attach a full archive of your installation including images (5 images is enough, don't send like 250), styles, scripts, etc. If you want it private, email it to me (that's what sanduwa did), you can find my address in my profile.

But it would be easiest if you could just put it up somewhere that I could have a look at it.

**madu** · 05-02-2010, 05:09 PM

jscheuer1,
i mail you a sample code. please tell me what wrong with it

thanks

**jscheuer1** · 05-02-2010, 08:03 PM

OK, I made a typo:

Code:

<script type="text/javascript">
(function(ar){
	var d = document.createElement('div'), a = document.createElement('a'), a1;
	a.rel = 'lightbox[Brussels]';
	div.style.display = 'none';
	for(var i = 0; i < ar.length; ++i){
		a1 = a.cloneNode(true);
		a1.title = ar[i][1];
		a1.href = ar[i][2];
		d.appendChild(a1);
	}
	document.body.insertBefore(d, document.body.firstChild);
})(slides);
</script>

It should be:

Code:

<script type="text/javascript">
(function(ar){
	var d = document.createElement('div'), a = document.createElement('a'), a1;
	a.rel = 'lightbox[Brussels]';
	d.style.display = 'none';
	for(var i = 0; i < ar.length; ++i){
		a1 = a.cloneNode(true);
		a1.title = ar[i][1];
		a1.href = ar[i][2];
		d.appendChild(a1);
	}
	document.body.insertBefore(d, document.body.firstChild);
})(slides);
</script>

Just that much will get it working, sort of. The next/previous, and close buttons as well as the loading and blank images aren't getting used because the paths are wrong in lightbox.css. In the archive you sent me they should be, for example (addition highlighted):

Code:

	background:url("../images/closelabel.gif") no-repeat;

Paths to background images in .css files are relative to the .css file, not to the page that uses the .css file.

Finally we do have the problem of duplicates that I was afraid of. This can be fixed in lightbox.js, use this version (right click and 'save as'):

Attachment 3287

There could still be other problems. But this worked well in Firefox 3 and in IE 7 and 8.

**madu** · 05-03-2010, 09:26 AM

Oh now it's working 100% perfectly

it's working all the browsers.
yes jscheuer1, you are a really genius. i appreciate your fantastic knowledge
and thank you so much.

thanks,
madu

Thread: Slideshow Vs lightbox

Thread Tools

Search Thread

The Following User Says Thank You to jscheuer1 For This Useful Post:

The Following User Says Thank You to jscheuer1 For This Useful Post:

Bookmarks

Bookmarks

Posting Permissions