Naina Mar 27th, 2006

I’ve just started using LightBox on my blog – and now you have an upgrade! Whoa!

Thanks Lokesh – browsing the internet has been quite useful for me in terms of learning about the possibilities. Thank you for sharing.

oneiros Mar 27th, 2006

/is excited

macx Mar 27th, 2006

What’s new on Lighbox 2.0?

codecraig Mar 27th, 2006

Lokesh! thanks much…can’t wait for it….well I guess I can…i’ve been waiting for some time already…but thanks for pulling through!

T aka! Mar 27th, 2006

And? almost finished? Can’t wait! :-)

Rich Mar 27th, 2006

making whats already great even better!
Lokesh is my hero.

Colin Cameron Mar 27th, 2006

Very exciting! My money is on the slideshow feature we have been hearing about.

Kevin Mar 27th, 2006

woot woot! I will be checking back often, very excited!

Jesús Acuña Mar 27th, 2006

Wow I cant wait for it :)

Jason Levine Mar 27th, 2006

Looking forward to it. I’ve already used Lightbox on my wife’s website for her class, a freelance project I’m working on, and a redesign of a website of mine (using WordPress). I can’t wait for 2.0.

Here’s hoping that the slideshow feature makes it in. That’s the #1 request my wife has given me. She wants to hit “back/forward” links to browse the photos instead of escaping and clicking the next photo. I must admit, I’d like that too. :-)

Jim Connolly Mar 27th, 2006

You need to slow down, you’re making the rest of us look bad.

Sunil Mar 28th, 2006

the demos are amazing! I was about to install Lightbox JS after discovering your site a couple of days ago. after seeing the demo, i’m going straight to v2.0

Jack Black Mar 28th, 2006

#11: On the contrary, you need to speed up.

James Mar 28th, 2006

Oh my God…

oneiros Mar 28th, 2006

James wrote: “Oh my God…”

You took the words right out of my mouth. Stunning!

Emmanuel Okorie Mar 28th, 2006

Totally gobsmacked….

stabani Mar 28th, 2006

definetly stunning.. waiting for it anxiously indeed.

Kevin Mar 28th, 2006

Just saw the demos! Amazing work! You set the original bar which other people imitate and improve on, then you come out with this and set the bar even higher! Great work! Cant wait to use it.

Judy Mar 28th, 2006

Lokesh, you rock! I am filled with anticipation, and hope you have the bandwidth to cope with the flood of traffic when you release it.

Koka Mar 28th, 2006

lightbox roqs. the demos are great.

Jeremy Mar 28th, 2006

Beautiful.

Big Dave Mar 28th, 2006

WOW, This is awesome! Thanks for setting the bar even higher!

Enzo Santagata Mar 28th, 2006

I thought Lightbox is exciting and could never be one better. Then Lightbox 2.0! Great
Waiting for the release

Anonymous Coward Mar 28th, 2006

This is *very* exciting. Thanks for all you do and letting us humble script kitties use your brilliant work!!!!

fens Mar 28th, 2006

http://www.lokeshdhakar.com/projects/lightbox2/ seems to be the new page for v2 :P course it might not be since its more a holding page

Serge Mar 28th, 2006

The preview does not seem to work in Firefox 1.5 for Windows. Has anyone else had this problem? Works fine in IE.

Jason Levine Mar 28th, 2006

Works fine for me in FF 1.5 and IE 6.

Oh, and the demos are even cooler than I imagined they’d be. I can’t wait to get my hands on this and add it into my websites. (My wife is sure to be very happy with the change.)

Dan Mar 28th, 2006

as Serge said, it too isnt working, in Firefox 2.01a and IE7, IE6. Only one that works is tke keys image rest just load image plain and simple.

Lokesh Mar 28th, 2006

#28 Dan – I haven’t tested in IE7 or FF2.01a yet, though it worked fine in my tests in IE6. I will look into this in the evening. Thanks for the note.

AsceticMonk Mar 28th, 2006

When I first saw Lightbox, I was truly ecstatic and quickly implemented into my blog, and I thought it is perfect. But when I saw the demo today, I was blown away. Man, it is so cool, so smooth and at the same time intuitive. I am anxiously waiting for its release, and thank you so much for your devotion on this project!

ian Mar 28th, 2006

I like the improvements

Caius Durling Mar 28th, 2006

http://www.lokeshdhakar.com/js/lightbox.js

Renduvall Mar 28th, 2006

You are to be commended. This is absolutely amazing! I was in the middle of trying to find a gallery script for my client last week when I found your lightbox. The *only* thing I could have wished for is the ability to move between photos. I have put off my client for the last couple of days when I saw your update hoping to install your new script, which I’m sure will blow him away. I am sitting by my computer waiting….

Side note: It does not work for me for Firefox v1.5 either. It just linked directly to the photos. But, amazingly, didn’t have a problem in Netscape 7.2, IE 6.0 or Opera 8. Any ideas why??

Renduvall Mar 28th, 2006

My apologies, Lokesh. I spoke too soon. The Web Developer bar in Firefox had ‘disable Java’ (but not JavaScript) and ‘disable minimum font size’. One of those must have messed with it, because its now working in Firefox 1.5 for me.
-Sorry.

Magnus Mar 28th, 2006

Awesome. I’m going to be using a modified lightbox for my wordpress blog. Thanks for making such a useful script!

Kavita Mar 28th, 2006

Its cool……. Like the improvements…

Keep it up…

http://www.ajaximpact.com

Colin Cameron Mar 28th, 2006

Just in time for reboot! I cant wait to play around with this.

The fade effect is neat but where is the picture? Safari just shows the overlay.

zOlive Mar 29th, 2006

Very nice new features… However, maybe you should make the images appear quicker in the slideshow (don’t wait for their frame to have finished its resizing… maybe trying to fade-in a ratio-preserved image inside the frame, as soon as it has successfully been loaded).
Kudos and thanks for all your work !

Colin Cameron Mar 29th, 2006

OK, it works for me now.. Its glorious!

Patric Mar 29th, 2006

Hey.

This is awsome. I have been looking for a gallery script for some time now, but can’t really find anything that meets my needs of intergratability and some other stuff, this does…as long as i don’t have too many pic’s to show, hehe…It takes some fiddeling to manage many pic’s, but once started and having to add a minor number of photos…Well, it rocks. I can’t wait for the next verision either…One thought tho…Is it possible to speed it up some, I’m currently on 2Mb hook up and it’s kind of “naggy”…

This works in both IE and FF for me, btw. FF ver 1.0.6 is good.

Regards – Patric.

Acha Ladka Mar 29th, 2006

Side note: It does not work for me for Firefox v1.5 either. It just linked directly to the photos. But, amazingly, didn’t have a problem in Netscape 7.2, IE 6.0 or Opera 8. Any ideas why??

I dunno if that really is a bug but , if the file size of the document in which the lightbox is included / used is huge :” heavy or wat ever [initLightbox()] is invoked only on [window.onload] so this might result in unexpected direct linking to the images , so it wud be better we invoke the function immediately after your links/gallery.

Great work Lokesh , Mujhe Khoob maja aaya iss script ko dekhke , great work man .. and a small dbt :D are u using Prototype for this if yes its too heavy , hope u wud this liteweight http://moofx.mad4milk.net/#methods its a small library and its good .. and the array idea was around my brain and u finished implementing it even b4 i cud get some time :X

Regard
Ek Acha Ladka

Acha Ladka Mar 29th, 2006

Oops how cud i forget this …. loads of kisses and hugs to all you girls who ever posted here and made lokesh happy , candies and roses xtra for every girl whos smiling right now .. beers for us .

I mistyped my email lol

blackshtef Mar 29th, 2006

Hi there!
I really like the script, and I attend to use it on my website, which is comming soon, you’ll be noticed and credited as well ;)

cya

codecraig Mar 29th, 2006

Digg it!

Dan Mar 29th, 2006

Lokesh just tested it in IE7 and Firefox 2.0a1 and works a treat very nice work!

Taka! Mar 29th, 2006

Thanks Lokesh!
I have been checking back every hour or so in the past couple of days, now I’ve got it up and running and it works like a charm. Thanks a lot!

Anonymous Mar 29th, 2006

Thanks again, I am currently incorporating it on my website.

With all this traffic for V2 it will be a good test of DreamHost, let us know if you have any problems.

Kevin

NOGG3R5 Mar 29th, 2006

Lokesh, how do you do it? Everytime you pull togethera new version f lightbox its great! V1 was good, the initial updates made it better, and now version two is stunning! its easily the most gorgeous image “thing” in the world yet!

Kean Tat Mar 29th, 2006

Thanks Lokesh,

I love the way you did it! so COOL and nicely done…
Great JOB! Always keep up the good work! Many Thanks.

KeanTat

Anonymous Mar 29th, 2006

Excellent job, thanks much

Jason Levine Mar 29th, 2006

It looks very nice. Unfortunately, I think I’ve turned up a potential bug. I was trying to integrate it into my wife’s site but it kept messing up. The photo pop-up would appear only way down on the page, and wasn’t styled.

After some debugging, I figured out that the stylesheet wasn’t being loaded up. I took the original, unzipped download and tried altering it bit by bit until I found the cause. For some reason, the script doesn’t like the CSS file being in a “Stylesheets” folder. It’s ok with “css”, “style”, and even “Stylesheet”. But add that last “s” and it bombs out. I’m not sure why this is, but I thought I’d let you know.

(Until the bug is fixed, I’ll put the CSS file in a “css” folder.)

graywave Mar 29th, 2006

Very nice. Is this LightShow added to LightBox? Or will LightShow be a different script?

Jeff Luckett Mar 29th, 2006

Great job. I’m pitching a few projects for which I intended to use (and modify) lightbox to do much of what you’re doing here.

Well done, and elegant. I like your style.

By the way … didja notice that Wired.com is using lightbox (or perhaps they’ve coded their own version) for pop-OVER advertising?

Chuck Reynolds Mar 29th, 2006

Man great new features with that image grouping – I had hacked my own together but yours seems “mo betta”.

Thanks for the hard work!

rYno

Serge Mar 29th, 2006

I reported earlier that the preview did not work in Firefox 1.5, well I’m glad to say that the final version works fine. Great script. I will try it later today on Safari at work; the preview really messed up the screen. Thanks!

Joram Oudenaarde Mar 29th, 2006

It’s incredible how something so small can grow out to be one of the biggest hypes and subjects on the web! Really nice work, and an incredible update as well :)

There is only 1 minor thing I’d love to change however;
- The animation is a tad slow for me personally. Is there a way to speed it up a little (and if so, how?).

For some reason, with all that fast internet going on around the world, (at least it feels like it), I like portfolio-/imageanimations to go faster :)

But kudo’s for making this miracle!

torneco Mar 29th, 2006

brilliant!!

can I use this for commercial-use?

NM Mar 29th, 2006

A couple problems – or actually 3.

1. I get a small box about 20 pixels wide in the bottom right corner of the white “frame??? of the picture that is not filled in.
2. The images show up in the bottom left corner instead of being centered.
3. I have tried all of the possible path variations but I can’t get the previous and next images to show up.

Rushi Vishavadia Mar 29th, 2006

Lokesh,

That is some amazing work on LightBox 2.0. Really well done! A good example about the power of JavaScript

Rushi

maro Mar 29th, 2006

hi, i’ve mede some changes to lightbox. http://maro.kristfest.cz/rocniky/valasske-mezirici-2004/fotky With mod_rewrite it’s very powerfull fotogalery.

Will Stumpf Mar 29th, 2006

This is awesome thank you very much! i am useing it on my blog (www.willstumpf.com/blog)

it works fine for me i havent had any errors yet (i havent been using it that long though :p)

well thanks again!

Will Stumpf
http://www.willstumpf.com

ivar Mar 29th, 2006

Good work!

One problem though. If the image is bigger than the browser window, the overlay won’t cover the parts you have to scroll to see.

This was not a problem with lightbox v.1. How can I fix this problem? Appers in all browsers (mac).

Thanks!

Regards,
Ivar

mikali Mar 29th, 2006

Excellent Work… this is very well done.

http://mobiko.blogs.com/mutant

JackO Mar 29th, 2006

Hey, great to see the progress! I updated my photo gallery with the script too!

ojacko

will Mar 29th, 2006

I’m having the same problems outlined in message # 58 when i open up my gallery in IE6. It works great in Firefox. nice job!

ivar Mar 29th, 2006

More problems.

- I can’t get the “Gets keycode. If ‘x’ is pressed then it hides the lightbox.” to work.
- Have you removed the “click on picture to close” function?

Jonny Rocket Mar 29th, 2006

You might want to make sure your DOCTYPE is set correctly. The index.html in the download has the correct setting. I was having troubles in IE and the DOCTYPE was the problem.

Now my problem, can the caption box be resized for larger captions (I realize its set in the css, but I don’t want to set it to 200px because that doesn’t really solve the problem.)?

Prashant Mar 29th, 2006

I just took a look at the demo, there’s only one word I can say, amazing!

Great work!

joeee Mar 29th, 2006

Person #1:: Who’s the man?

The World:: Lokesh is the man

ivar Mar 29th, 2006

#67: My doctype is set (HTML 4.01 Strict), and the code is validated.

will Mar 29th, 2006

thanks, johnny rocket, that was it. works properly in ie now

Koka Mar 29th, 2006

NM Mar 29th, 2006

Ok – changing the DOCTYPE sort of fixed it.

The image now loads in the middle of the page like it should and the missing box shows up. BUT changing the DOCTYPE obliterated my CSS menu. Doesn’t matter if I use 2 different style sheets or incorporate lightbox.css into what I already had. Same results.

So I’ll keep playing with it ……

Mauti Mar 29th, 2006

Hi,

great work! I really love the look and feel of your script, however I miss some functionality from Lightbox 1.0:

.) Pressing the x key in Safari and Firefox doesn’t close the pic again(I guess you forgot that and it is really easy to add)

.) Clicking outside the picture frame doesn’t close the pic anymore(also easy to readd I guess)

Although these 2 things are just small ones I really miss them and hope that you readd them. Further isn’t it possible to add in addition to the mouseover that shows the next and prev arrows, to ask in Javascript where the mouse actually is so if you click on the arrows there are still blend in on the next one. Right now you have to move outside the pic frame and then the script recognizes the mouse and shows the arrows. I think in terms of usability design this would be an important addition.

Well excellent work, and keep it up!

Greetings from Vienna,

Mauti

Mauti Mar 29th, 2006

Ups my thoughts jumped a bit here again:

* Further isn’t it possible to ask for the current location of the mouse, in addition to the mouseover that shows the next and prev arrows. So if you click on the arrows there are still blend in on the next loaded picture. Right now you have to move outside the pic frame and then the script recognizes the mouse and shows the arrows. I think in terms of usability design this would be an important addition.

Kevin Mar 29th, 2006

Here it is incorporated into our site!

Ezell Aviation

Check the latest P-38 update.

onlyUMPC.com Mar 29th, 2006

Hey lokesh – Greak work, now i need to look how i can upgrade my gallery plugin without breaking anything :)

Thanks for sharing and keep it floating

Michael McCorry Mar 29th, 2006

Fantastic work Lokesh! Love your work.

A few of points of feedback:
1. Prototype.js and scriptaculous.js are very large requirements for projects where bandwidth is an issue. I agree with #41 that Moo.fx is a much smaller (3KB) and equally competent library and works well with their own mini-prototype, Moo.ajax (which is great also). If there was a Moo.fx version of lightbox.js, I would be much more inclined to use it for more projects.

2. The transition animation could stand to be a little faster. That looks easy to alter in the resizeImageContainer function, however, perhaps a variable for animation duration/delay in the config section at the top might be a good idea.

3. While on the subject of configuration, it would be great to be able to specify the position of the caption (top or bottom), as well as the corner for the close button (tl, tr, bl or br).

Thanks, not only for all your hard work, but also for sharing it with all of us.

Carlton Dickson Mar 29th, 2006

I would love to be able to pop up a page similar to this
http://www.arsenal.com/player.asp?thisNav=first+team&plid=60089&clid=4421&cpid=703
so I have the picture and some text accompanying the pic…I need to produce a staff page for a website and need more than a picture.

If anyone has implemented something similar please post links to examples or even better a web page guiding through the creation process.

Could this be done with what post #41 mentions…moo.fx?

Thanks,

Carlton

BillSaysThis Mar 29th, 2006

This looks terrific. My question: If I don’t want to show any images on a page, such as a list of galleries, but launch from a text link, can you tell me how to do it?

banglogic Mar 29th, 2006

Just want to say thanks Lokesh. It’s a great script and it was very easy for me to implement. I’m using it for the photography portfolio section of my site.
You make me look awesome!

You can see it in use on my site here:
http://www.banglogic.com/photography/folio1

Thanks again,
-k²

Bart Mar 29th, 2006

HI:

Great work! I’ve run into a problem with IE7 (ver. 7.0.5335.5) however. Whenever loading the page, I always get the same error, “line 627, char3, can’t execute code from a feed script”. And the lightbox doesn’t work. Manually refreshing the page always fixes the problem completely. Any workarounds for this?

Thanks again,
Bart

codecraig Mar 29th, 2006

wow…I posted this story on Digg an over 1100 diggs!!!

woo-hoo!!

Alex Mar 30th, 2006

Great work! Just found original, and this is much better. Keep em coming!

Suggestions for future releases:

Ability to click image or outside image to close image.

Inlcusion of the resize feature seen in Lightbox_Plus.

Otherwise, keep kicking ass!

Jason Mar 30th, 2006

Impressive. Most impressive!

I set up a test page on my site:
http://jasonfricke.net/lightbox2

I made some minor changes to speed it up.

There are a couple of bugs you will notice there. One is that the forward navigation image does not anchor to the right side of the frame, but floats several pixels inside. Second, the caption box is less than the width of the frame, it is the width of the image. The images are 800×533. I haven’t tried with smaller images yet.

Ryan Mar 30th, 2006

I just recently came across your gallery system and I am simply amazed. Its freakin awesome. – Ryan

Ravin Mar 30th, 2006

OK… i’m having a really tough time with this.
I downloaded the zip file and when i try to open the included index.html in FireFox 1.5.0.1 the sample doesn’t work at first… the image image link takes me to a page with the image in the upper left corner.
I try again in a few seconds, without closing the tab, but hitting back and then the same link again… and all the pretty stuff works.
I even tried clearing the cache between the first and second try and I get the exact same results. I’m really confused.
When I try this in IE it works just fine.
any ideas?

preben Mar 30th, 2006

Hello,

I was trying lightbox V 2.0, but i have a little problem.
You can see the result at

http://users.telenet.be/prebenhermans/screen.jpg

can somebody tell me what i’ve to do, to get the right arrow beside the border?

Thx

Floria Mar 30th, 2006

Hi preben, I have the same problem ,too.
and I has one more problem, the photo isn’t shown in the middle of browser.
http://img53.imageshack.us/img53/7663/problem6we.jpg

i dont’ know how to fix, can someone tell me how? Thx.

Dan Mar 30th, 2006

Nice work, I’ve dropped the Lightbox 2 stuff into my Wordpress install with no problems at all. I did find notice that when I ran a speed test against my site, I was getting 404s for the javascript files called from scriptaculous.js. Are there a couple of files missing from the download?

Otter Mar 30th, 2006

Is it possible to supress the image’s width and height information?

Thanks for this great script. I could never hope to write anything like this.

Paul

audienceone Mar 30th, 2006

Great script! May I give you a pat? *pat*

kristine Mar 30th, 2006

You made my day! :-) Really good job.

Dave Mar 30th, 2006

Hey!

Great script! And a very nice way of useign jscript…!

“Just” push the site up, looking n1er – whitout making the user with no-jscript unable to use your page! Great!

I hope I can include your script(s) at my new browsergame…

Dave (from Switzerland)

Preben Mar 30th, 2006

Hello Floria,

I know the solution for your problem,

in the lightbox.css file you see in the top this code

1 #lightbox{
2 position: absolute;
3 top: 40px;
4 left: 0;
5 width: 100%;
6 z-index: 100;
7 }

Now you have to change rule 4 from
left: 0; to left:30px; for example.
I have changed it in my website to left:30%; and now the pictures are in the middle of my browser. So you have to try untill you have the right value.

Greetz!

P.S.: If anyone know the solution for the problem in comment #88, please help us!!!

Toadward Mar 30th, 2006

really nice work !!!
thank you

peppe Mar 30th, 2006

I create a wordpress plugin based on your script.
http://www.4mj.it/lightbox-js-v20-wordpress/

Jono | Iconaholic Mar 30th, 2006

Brilliant work!
Donation sent :)

Scott Mar 30th, 2006

For #82, I had the same problem with the ‘could not execute code from a freed script’. Googled it real quick and came across mentions of needing to have links to the js after meta information. Only showed up in IE. Sure enough, I had pasted the links above the meta; swapped and never had a problem.

Now I need to figure out the how to fix the right nav arrow not being against the right border in IE7.

Mark L. Mar 30th, 2006

Great improvement.

HOWEVER, one of the most important thigs (that is also present in other LB mods) is overlooked: what if the image that is opened is larger (in height, for instance) that the window? overlay no longer cover the buttom part of the screen.

It’s a simple fix (re-calculating the page size and redoing the overlay image) and I wish I knew JS to make the chane. Would anyone look at this please?

Thanks :)

Mark L. Mar 31st, 2006

OK. I played around and added the following:

if (typeof(originalheight) == "undefined") { originalheight = pageHeight };
before “return arrayPageSize;”
AND

if (imgHeight > originalheight) { Element.setHeight(‘overlay’, imgHeight 180);}
if (imgHeight <= originalheight) { Element.setHeight(‘overlay’, originalheight);}

before “this.showImage();”

perhaps there’s a better solution. this corrects only VERTICAL scroll area.

Jeremy C. Mar 31st, 2006

I clicked on Lokesh’s donation link, and noticed that only 15 people have donated. Seems to me with so many people using the script and asking for tweaks/fixes/improvements that all the people using this code could at least drop him something for his time and creativity – plus his willingness to share.

I haven’t had a project to implement this into yet, but will certainly donate in appreciation when I do.

Nice work, Lokesh.

Paul Mar 31st, 2006

I’m blown away by this! Your hard work and attention to detail is outstanding.

Excellent work.

http://www.pauljamesdesign.com.au

tripdragon Mar 31st, 2006

are there plans to dynamicly build image list gallerys with this ???
Like stick the index folder in a folder with lots of images

Brandon Mar 31st, 2006

I’m trying to implement LB into my MovableType photoblog. My main index contains the current entry, which is a thumbnail image linked to its original. When I create the entry, I use the rel=”lightbox” attribute in the image link tag and it works perfectly.

However, in the permalinked/archived version, clicking on the image simply produces the new image in a new window, without LB. All the LB code is identical in both templates and the links all point to the same locations. I can’t figure out what the problem is.

Here’s the site (which isn’t even ready for primetime yet — the only archive is the current entry, so click on the image title to get the archived version): optic anarchy

ecila Mar 31st, 2006

very hot.

Gabriel Bratescu Mar 31st, 2006

Very very nice.
But i have a problem:
For Preben on #88: How did you rezolved that problem ?

Ethan Mar 31st, 2006

isn’t there a feature to automatically resize large images to fit inside the screen?

-Ethan

Preben Mar 31st, 2006

Hello gabriel,

i haven’t resolved my problem yet.
I’m still searching in the code.

If you know how to fix it let me know plz…

Greetz

Tiggr Mar 31st, 2006

Hi!

The new version works fine for me at: http://www.colorful-sky.de/workshop/index.php?idcatside=79

Thank you very much!

Gabriel Mar 31st, 2006

Preben, in your page do you have any other divs ?
In a simple page, just like the example in .zip, woks perfect.
But i have a php (smarty) + mysql image galery where i have other divs.
It seems not to like my divs :)

Johannes Theile Mar 31st, 2006

Such a great gizmo! How could I have lived without! *gg*
Please continue the great work!

Johannes

Gabriel Mar 31st, 2006

Problem resolved: in lightbox.ccs instead of “53% left” i put “left 53%” , same change for right. Not working in Firefow 1.5 …….

DimP Mar 31st, 2006

Nice work but you’ve missed a usability problem.

How should an average first-time user know that you can navigate between images in image sets? I discovered the mechanism by pure luck when I hovered the middle right/left of an image. I think it should be more obvious than that.

oldskull Mar 31st, 2006

sagerao! lo usare!!!!

Kezia P Mar 31st, 2006

So far I Love the modification

jc Mar 31st, 2006

chulo chulo… muyyyyyyyyyy chulo…
thx for the work!!
;)

bish Mar 31st, 2006

Anyone have the 2.0 zip file around.

2.01’s movement/positioning are all borked up.

Safirul Alredha Mar 31st, 2006

I’ve switch addLoadEvent() to scriptaculous Event.Observe for event handling. Plus I’m sort of updating my previous Lightbox plugin — http://zeo.unic.net.my/2006/03/29/lightbox-js-version-20/

Colin Cameron Mar 31st, 2006

Does anyone else have to put the full url to the images in the lightbox.js? They will only show up if I do.

Jerry Mar 31st, 2006

Very nice. I may be doing something wrong, but the lightbox windows won’t close when I use images larger than about 500×500 (which I don’t really WANT anway but…). When opening large images the “X” button doesn’t seem to work – not sure if it’s an issue with Firefox or something else. Anway, this is great – I’m not much of a web designer and I got it working in no time.

Juani Mar 31st, 2006

When using the script on Firefox 1.5 (WinXP SP2) with the Cache disabled, the image that was previously loaded, load first, and then it displays the right image. In IE6 works fine though…

ryan Mar 31st, 2006

In IE6, it’s not centering the display window, in Firefox it’s fine.

I’m using

Naturally, if I drop the doctype, it’s fine. I made any adjustments suggested in the FAQ and read here, to no avail. Any suggestions?

Paul Payne Mar 31st, 2006

Beautiful! It took about 20 minutes to integrate this into ~400 sites here (click on a photo to be taken to a photo album that uses lightbox). I am really excited to start getting some customer feedback.

Anyone know why Firefox puts a dotted line around the half of the photo that was last clicked? I think it is a Firefox feature to show the user which link was last clicked… anyone know how to turn this off (in the script)?

Steven Hagen Mar 31st, 2006

Great job got it working on my site really easy But I not sure how to make indepent captions to say what the picture is about.

am I doing something wrong?

Floria Mar 31st, 2006

Hi Preben,
thx for tour reply, I’ve solve my two problems at all.
I take the new version Lightbox JS 2.01, maybe you can try it.

http://www.lokeshdhakar.com/projects/lightbox2/
v2.01 – Centering in IE6 (any DOCTYPE) fixed.
Smoothed out resize transition.

Good luck!

Ben Mar 31st, 2006

Nice upgrade, but I have 2 ideas and a question:

Firstly, the fade to black of the background page only seems to happen after the image has loaded, or at least after the white box has appeared. I think this’d look better if the black-out was the first thing that happened.

Also, when clicking through multiple images, It might look better if one picture faded straight into another, instead of jumping to white and then fading it in.

Finally, how can I initialise a set of images only using a single link?

Ben Mar 31st, 2006

Ah no, it wasn’t the late fade-in of the black that I meant, it was the sudden appearence of the empty white box.

Great script anyway, I’d have no idea how to start something like that.

Brandon Mar 31st, 2006

Regarding my previous post (#105), it turned out that I had the three lightbox javascript files listed out of order on my archive template. Once I put them back in the right order, everything worked perfectly.

paul Mar 31st, 2006

I’m using Opera 8 and it seems that the overlay is completely black, as ooposed to being sem-transparrent. It appears to be working ok in FF 1.5 and IE6. Anyone else having this problem?

paul Mar 31st, 2006

also….. if anyone has any info or a link to somewhere that does on using Lightbox with iframes/dymically loaded pages… feel free to post it. There was some discussion before, but no definate answer…. I just thought I would ask, seeing these posts seem to be more active.

Anonymous Mar 31st, 2006

ok, ill stop spamming here in a sec. I actually need a solution using lightbox when loading my gallery into divs with AJAX.

You can see an example of what I mean here:
http://www.dynamicdrive.com/dynamicindex17/ajaxcontent.htm

and you can see where I am trying to use it on my site….You will notice it works fine on the main page… but if you click on the ‘portfolio’ link at the top, which dynamically loads the content into the div, lightbox wont work anymore…. any solutions?

http://www.pauldonnelly.com/portfolio/index.htm

nacho Mar 31st, 2006

Using wz_tooltips makes the caption disappear. It doesn’t seem to be a font color issue. Is there a way around that?

nacho Mar 31st, 2006

Nevermind, replacing the first instance of “title” in lightbox.js with “alt” and putting the caption into the alt text restores the caption.

zeek Mar 31st, 2006

It would be nice, to be able to insert links into the caption.

Safirul Alredha Apr 1st, 2006

If you use loading ID on your other application this will break Lightbox 2 loading spinner. The spinner will fail to hide or disappear when Lighbox is done finish loading the image.

It’s either you change Lightbox 2 loading ID’s in lightbox.js and lightbox.css to something else that’s unique or vise versa.

Antti Tuppurainen Apr 1st, 2006

I have created a huge success Joomla LightThumb based on the lightbox -script.
http://extensions.joomla.org/component/option,com_mtree/task,viewlink/link_id,412/Itemid,35/

Fantastic.

TotoMat Apr 1st, 2006

Hi,
got a problem under Mozilla 1.5+ and firefox

ToToMat the return Apr 1st, 2006

Hi, (second post, my precedent message had an html tag, sorry for that)
got a problem under Mozilla 1.5+ and firefox before 1.5 on Mac OSX : region to click to go to next or previous image is limited by dotted borders after a click. Is there a way to hack that thing ? Thanx in advance…

TM

Mike Apr 1st, 2006

Does anyone know how you would center both horizontally and vertically the lightbox DIV within the browser window?

Currently it positions centrally horizontally however it lies just 40px from the top of the window…

Any ideas?

Mike Apr 1st, 2006

Also does anyone know how you turn the image resizing off when you scroll between images in age sets? As I have images of identical sizes…

nico Apr 1st, 2006

im having the same issue posted in #139

any ideas?

Vladimir Apr 1st, 2006

to #132: after you change the innerHTML of a div, run initLightbox()

sialivi Apr 1st, 2006

#143 Vladimir,

I have the same problem, but calling initLightbox() after the update doesn’t seem to help.

Rbt. Apr 2nd, 2006

I noticed someone else mentioned the inability to put links into the captions. I don’t know if that is possible, but if it is I’d love to see that in future versions.

Erby Apr 2nd, 2006

your are a god among men, I commend you and your hard work. Your script MAKES my site’s gallery, without it, my gallery would be nothing. Can’t wait for the caption update.
http://serdmanczyk.homeip.net

Hieu Apr 2nd, 2006

Thanks for your script. But I ran into a problem of the fading property:
when click on an image, the PREVIOUS image did the fading and then the current image jump out of nowhere. the fading image is supposed to be a current image.

Please tell me what to do, thanks

Hieu Apr 2nd, 2006

I forgot to mention that test browser is FF 1.5. This does not happen in IE 6.0

ROFL Apr 2nd, 2006

ROlF?

Resnumerica Apr 2nd, 2006

thanks !

K

Viking KARWUR Apr 2nd, 2006

Thanks… it’s rocks!

Greetings from Indonesia.

Keith Apr 2nd, 2006

Hi Lokesh, I am very impressed with your development of Lightbox JS 2.0. I notice that there is a bug (minor) while loading the image, under Microsoft Internet Explorer (IE). I used IE 7 Beta 2 Preview, and it might occur under IE 6 as well.

Basically, upon clicking the thumbnail, the background with darken, with the image showing. However, if my page is very long that users need to scroll down, then there I have the “darkened background” isn’t fully 100% of the page. You may take a look at an example here http://keith.hostmatrix.org/location.htm and by clicking on one of the maps.

The bug is not existence in Firefox; only in IE.

Lewis Apr 2nd, 2006

I’d also be interested in finding out how you could align vertically the lightbox div as mentioned in comment #140.

I’ve had a look but havent worked it out yet…

surfer66 Apr 2nd, 2006

I just plugged it into my web page. wow, worked the very first time!
Link: http://infinitegood.net/kite/index.php
Its a small link at the bottom of the page but very cool.
Thanks dude!
Pete

Jeff Apr 2nd, 2006

Lokesh, I’m eager to try out ver 2. Thanks.

We used Lightbox on a recent interactive on our museum Web site with an imagemap. We’ve gotten some nice compliments on it.

One thing that would be helpful. Right if you use the title tag to incorporate captions on the images these titles appear when you rollover the thumbnail. Unfortunately, we need to format our captions using italics for artwork titles and the code entities are showing up on the rollover. Didn’t look good so I decided the only workaround I could do was to add the captions within the larger graphics and forget the title tag. It would be nice, however, if there was a way to fix the title tag issue.

the fly Apr 2nd, 2006

Hi,
great script. However, background isn’t fully 100% of the page when I try to scroll my page. A little bug: it’s impossible for the user to save/download the images: when I try to right click on the image..the option “save image as..” in firefox doesn’t appear… :(

best regards from Italy

Torsten Apr 2nd, 2006

Hello,
Thanks for awesome functionality.
I just have one bug problem:

In firefox 1.5 i get a blinking vertical line somewhere in the middle of the photo , probably just between the active areas for left and right button. This does not occur in IE, and it does not occur on the first photo (with no left arrow) and on the last photo (with no right arrow) so it seem to be related to that. Does anyone know about this problem.
check it with firefox 1.5 at http://www.aahren.com/photos/

Thanks a lot

Vladimir Apr 2nd, 2006

To 144:

I don’t know what to say except to suggest that you carefully check your code to make sure that all links have “rel=lightbox” AND that you run “initLightbox();” (without any parameters) after you change the innerHTML of a div.

It works fine, trust me :)

Yuvraj Kalra Apr 2nd, 2006

So great… Thanks

Jeranon Apr 3rd, 2006

Hey everyone. I have to agree. Amazing script. I’ve run into some trouble w/ my own use of it (in FF 1.5). If you were to go to: http://jeranon.com/pages/aboutme/ and click on one of the images, you’ll find that the text loads to the right of the images and then “snaps” to the center. Has anyone else had this problem? Does anyone have any ideas why it’s doing this? Any/all help is appreciated. Feel free to contact me@ jeranon(at)hotmail(dot)com
Thanx all, and Lokesh, thank you for this beautiful script.
Jer

anthonyjhicks Apr 3rd, 2006

Hi all, full-marks Lokesh, love the script (I sent a donation to show my appreciation). Anyway, one thing that was bugging me was the need for the page to fully load before the script would init on window.onLoad. So I dug around and applied the technique discussed at http://dean.edwards.name/weblog/2005/09/busted/

As I have pages with lots of thumbnails that can take a while to download, I wanted to trigger the lightbox init when the DOM had finished loading, and allow the lightbox to be used while the image thumbs continued to download in the background.

I put the following in my page head to hook the init event to DOM load, and load lightbox earlier:

function init() {
if (arguments.callee.done) return;
arguments.callee.done = true;
myLightbox = new lightbox();
};
/* for Mozilla */
if (document.addEventListener) {
document.addEventListener(“DOMContentLoaded”, init, null);
}
/* for Internet Explorer */
/*@cc_on @*/
/*@if (@_win32)
document.write(“”);
/*@end @*/
/* for other browsers */
window.onload = init;

Also create a js/ie_onload.js with a single line:

init();

Edit lightbox.js and quote out:

//addLoadEvent(initLightbox);

Now init() will run when the DOM is loaded and the HTML is safe (relatively) to be parsed by lightbox, making lightbox usable before other page elements have finished downloading. Seems to work fine on FF and IE 6 on Win32. Not tested on Mac or other browsers, so your mileage may vary. The implemenation of the final window.onload = init; seems to provide backwards support.

Paul Apr 3rd, 2006

YOU NEED TO SET UP A FORUM!!!!

Amy Apr 3rd, 2006

Great stuff.. thanks. How would i set it up to open from a text link and display a series of images???? Having to have all the thumbs visable is annoying and limits it’s usage.

Cheers,

joseph tate Apr 3rd, 2006

This is beautiful stuff, truly.

Now to the problem: I’ve gotten it to work successfully on one site, but on another it fails. Could be any number of reasons, but I want to ask point blank and see if there’s an answer: yes or no, is it possible to use rel=”lightbox” on any link tag? and I mean any as in can you have text only and no thumbnail?

If that question can be answered, just a quick yes or no, I think I can troubleshoot the rest and find the mistake(s) I’ve made.

And again, THANKS for the work. Once I become un-unemployed, I will be donating. Lots.

Danilo Laurindo Apr 3rd, 2006

Just great! :)

Works perfectly!

NM Apr 3rd, 2006

Got it all working with the new version,

EXCEPT – I still can’t get the previous and next images to show:

url(../images/prev.gif)
url(../images/next.gif)

which makes no sense because the background shows up and it’s in the same folder, using the same path:
url(../images/blank.gif)

Edward Apr 3rd, 2006

Hey there Lokesh …

Very beautiful effect. One issue, from an IA perspective, is on the sets. It would almost be nice to see a in the bottom right corner, which would let users know that they can shuffle through the set by rolling over the image. Or even moreso, maybe little thumbs of the gallery in the caption space.

I hate naysayers, so I hope I’m not being one. Thank you for creating some great code. Just wanted to throw a coupla’ things out that you might already be working on.

Cheers

Mike Apr 3rd, 2006

To Amy #163…

I got a text link to show multiple imags using the following code:

Link Text Here

Hope that helps…

Now can anyone offer any advice for my comments mentioned in #140?

Grady Apr 3rd, 2006

Is there a way to make the caption height taller? When the title is long enough to fit on 3 lines, it runs into the bottom of the lightbox. :o(

I need it to get taller with the text.

Any ideas?

Thanks

Anonymous Apr 3rd, 2006

oops sorry the comment actually activated the link; the code I used can be seen here:

http://www.boomspeed.com/mclaren02/link.txt

View source that page to see it, if that activates the code too ;)

Anonymous Apr 3rd, 2006

To Grady #169

In the stylesheet, locate: #imageDataContainer{

and change the height, which is currently 38px to your desired height…

Johno Apr 3rd, 2006

Brilliant, brilliant, brilliant!
2 minutes to setup, and works across browsers; and looks fantastic. I’ll be donating towards this script.
Great work and thank you!

eric Apr 3rd, 2006

great code.

i donated some dough cause you deserve it.

I think to the point of letting people know that you can shuffle, maybe a simple numbering script would work.

1/5 images or 1 2 3 4 5 etc…. with current image hilighted.

thanks again.
see my use of version one on http://www.contrecoups.com

Grady Apr 3rd, 2006

Thanks poster #171 :o) … I shortly found that myself.

Anonymous Apr 3rd, 2006

sads

Buzz Apr 3rd, 2006

Fantastic script !
I’m having a problem with version 2.01 though.
I got version 2.0 working no problem, and then replaced lightbox.js with the new 2.01 version, and it works ok in IE6, but now goes wonky in Firefox 1.5.

I also tried replacing the scriptalicious.js and protoype.js files with the new onces, but it’s still crazy in Firefox.
File paths are all fine as far as I can see.
Do I have to change anything else ?
Any ideas ?
Buzz

Brent Dillingham Apr 3rd, 2006

Great stuff.

However I wanted to extend this info: I had problems with this in Safari initially — turned out it was due to some filtering that the Pithelmet ad blocking extension was doing for localhost =] So beware, Safari users.

Rizky Apr 3rd, 2006

yaiksss! it hasn’t been a month since i used the first version. and now there’s the second one. awesome…

MN Apr 3rd, 2006

Has anyone found a solution yet to the problems mentioned in #152 and #156? If you need to scroll down the page when viewing in IE6, the “darkened background??? isn’t fully 100% of the page. Thanks.

Sean K Apr 3rd, 2006

I’ve figured out a way to adapt the changes I made to allow Lightbox to work with iFrames to work with Lightbox 2.0. I’ll try to make the changes here more clear.

Insert the script calls into the header of the PARENT html file as you normally would.

:

The following changes are made to the IFRAME contents HTML:

You will not be adding the REL=Lightbox tags to your HREF’s, instead do the following…

In the Iframe HTML, change the href of your link to javascript:Void(0) and add an onclick call to a function updateme(this).
Your link should look like this:
click here for a larger image

NOTE: The onclick event points to a script located in the parent document, that’s why it references “window.parent.”

Also create a form with a hidden form field with a value = to what the href of your link originally was. It should look like this:

This form is important, it’s going to hold the value that we will pass to lightbox to open the image.

The following steps occur in the PARENT HTML document.
In the parent file create 2 functions that does the following.

Function cloneObject(what) {
for (i in what) {
this(i) = What(i);

}
}
Create the function for your onclick event in your link…
Function updateme(obj) {
var newobj = new cloneObject(obj);
var iframe = window.frames['collectionContent']; this has to be the name of your iframe.
var iframedoc = iframe.document;
var iframeForm = var iframeForm = window.frames['collectionContent'].document.TheForm; this has to be the name of your frame and your form.
var hrefvalue = iframeForm.hiddenfield.value; this has to be the name of your hidden field.

newObj.href = hrefValue
myLightbox.start(newobj);
}

Basically this function clones the values from the original link into a new value and sets the HREF value to the value stored in your hidden form, which should be the path to the image you want displayed. It then passes the cloned link to the lightbox script .

In order to get this to work with the cloned link value, you have to modify the lightbox.js script.

In the Start Function section of the script you’ll need to remove the following lines:

if (!document.getElementsByTagName){ return; }
var anchors = document.getElementsByTagName(‘a’);

// if image is NOT part of a set..
if((imageLink.getAttribute(‘rel’) == ‘lightbox’)){
// add single image to imageArray
imageArray.push(new Array(imageLink.getAttribute(‘href’), imageLink.getAttribute(‘title’)));
} else {
// if image is part of a set..

// loop through anchors, find other images in set, and add them to imageArray
for (var i=0; i

Sean K Apr 3rd, 2006

Sorry that last post was so long, no other way to get all the information in there…

los Apr 3rd, 2006

Has anyone tried to incorporate this image zoom in with lightbox?
http://valid.tjp.hu/zoom/index_en.html

I’ve been trying, but I’m not so good with javascript.

Sean K Apr 3rd, 2006

The link in my description post got formatted as html. It should look like this:

a href=”javascript:void(0)” name=”mylink” onclick=”window.parent.updateme(this)” click here for a larger image

dleifm Apr 4th, 2006

Howdy!

Thanks so much for this sexy code! If you’d like to see my version, check it out here:

http://www.paulnicklen.com/new/Galleries/p_bears.html

That’s the only gallery that I’ve got up so far, but many others will soon follow.

If I had any money, you’d have some of it.

Rom S Apr 4th, 2006

Lokesh,

This script is by far, one of the coolest things I’ve found on the net. Thank you very, very, much for coming up with it.

Is there anything at all I can do to convince you to add an auto image resize feature to fit images inside the viewable window like the following:
http://serennz.cool.ne.jp/sb/sp/lightbox/index.html ? If you could add that, I think my life life truly would be complete.

Thank You.

Walter Apr 4th, 2006

Hi,

great piece of software!
But there seem to be problems with the calculated height (tested with Firefox 1.5 and Safari 2). The “imageContainer” laps over the “imageDataContainer” so you can’t klick on the close link (or just on the lower part of it). The higher the image (ie 1000 px), the higher the miscalculation.

Thanks!

uncle wilco Apr 4th, 2006

Hi donation sent, using it on my shed site

http://www.readersheds.co.uk/readersheds/share.cfm

wilco

Jono | Iconaholic Apr 4th, 2006

Thanks for the update, but there now seems t be a bug :(

When hovering over the close button/label I have to hover lower than the close button (almost on the bottom edge of the border) rather than the button itself to be able to close the preview. On larger images I can’t close the preview at all.

Tested in Safari, Camino & Firefox (Mac) & the problem arises on all of them.

Hopefully this can be fixed :)

Tiggr Apr 4th, 2006

A good thing is getting better!

Thank you very much!

Anonymous Apr 4th, 2006

From comments (#68 Ben Schwarz), (#177 Tony )in the v1 thread, and (#140 Mike) and (#153 Lewis) in this thread…

Has anyone worked out how to position the lightbox DIV “absolutely” vertically within the browser window – even when the window is resized? It currently positions horizontally but not vertically….

Thanks and may I reitterate what a wonderful script this is!

Brian Apr 4th, 2006

Awesome tool !!
Had problems with Flash though showing on top of image.
Fixed with adding:
document.write(”);
document.write(”);

and

wmode=”opaque” menu=”false”
in the document.write(”)
statement in a JS file where the flash is called;

Works great now…

(Also could have lowered the top down as my flash is only above my menu).

Thanks.

Lokesh Apr 4th, 2006

#186, #188 Thanks for catching that bug so quickly. Its been fixed.

Louis Apr 4th, 2006

This is really some nice work. I like it very much.

I have a question, maybe for an update: is it possible to so something like this with a video? Exactly the same, but then in stead of a picture, a moving image with sound.

Jono | Iconaholic Apr 4th, 2006

Great, thanks for fixing it so quickly :)

Jonny Rocket Apr 4th, 2006

To those using FF and getting the dotted lines around the “active” area, I had this happen on my wife’s computer and just updated her FF install and the problem went away. So I guess the “fix” is to make sure you’re running the most current FF.

Jonny Rocket Apr 4th, 2006

Just gave 2.02 a try and it’s exactly what i’ve been looking for. Now if only I could get the rest of my site to look as nice…

MrSticks1982 Apr 4th, 2006

Thank you for a wonderful product, you have saved me a lot of time because this is exactly what I had in mind for my personal website!!

Keep up the great work!

Spook Apr 4th, 2006

Wow. Love it.
You are the best.

Wiktor Apr 4th, 2006

Just a fiddle-faddle. In the ligthbox.css you suppose that the loading image in the #loading div is inlined.

In my css the image inherited an display: block, so the text-align: center doesn’t worked. I put this extra line to lightbox.css
#loading img { display: inline; } and everything works fine! :)

Thank you for this great stuff! :)

Talguy Apr 4th, 2006

Can some one tell me why lightbox will not load the loading.gif and close.gif. I uploaded a couple of pictures to the web page that has the same problems as the pages running on my testing server. Can somebody look at my site and the code and tell me why these 2 things do not load up.

http://www.freewebs.net/gobock/gallery.html

nico Apr 4th, 2006

still wondering about this FIREFOX bug:

has anyone figured out how to get rid of the dotted lines surrounding the left or the right side of each picture?

Paul Apr 4th, 2006

#143 Vladimir
April 1, 2006 @ 5:43 pm
to #132: after you change the innerHTML of a div, run initLightbox()
———————————————————-

THANK YOU! That totally fixed it. I’m kinda new to JS so I couldn’t figure it out myself.

Thanks again.

Vincent Apr 4th, 2006

hi,

I’m sure this question has been asked many times before,

I use the script on my image archive and I have alot of images in one page, but the script will not load until only after the whole page has finished loading. Is there anyway to overcome this?

alan Apr 5th, 2006

I was wondering, would this script be able to display a Flash file (swf) in a similar manner?

Juan Pablo Reyes Apr 5th, 2006

its’ very coool!

i test this script in gallery1.

You can see it on my site here:
http://www.mundocarrete.com/fotos
Thanks.

Thomas Mraz Apr 5th, 2006

hi,
that is really great work! i installed lightbox2 within twenty minutes and it´s perfectly working!!!

THANK YOU FROM VIENNA/AUSTRIA!

Olaf Apr 5th, 2006

Hi,
this in scriptaculous.js works not when you XHTML as application/xhtml+xml give:
document.write(”);

Have you a Fix?

Olivier Ramonat Apr 5th, 2006

Hi,

I have develop slidebox based on lightbox v0.1 to have a slideshow
support based on XML files. You might be interested to see how I have
resolved the problem that occurs when user clicks before the page has
loaded.

Moreover, with the XML solution you can add images to your slideshow without
displaying these images on the page. You just have to add a link into the
XML file.

http://olivier.ramonat.free.fr/slidebox (this website can be extremely slow)

Steve-0 Apr 5th, 2006

I was using the old version of lightbox, slightly modified. I also was using the prototype library and scriptaculous’ Sortable effect on my page. After adding the updated lightbox.js, lightbox.css files to my site, my page is getting errors after initializing. The error is:

‘Element’ is undefined.

Also, if i use the

tag in my page, Sortable won’t work, because if I’m not mistaken Sortable is in a different file than effects. Is there a way around having to declare the same file twice?….or can i just use:

which would reference all the scriptaculous libraries.

Any of you javascript gurus are free to jump in on this one…

steve-0 Apr 5th, 2006

err….my html was omitted from the post above:

Also, if i use the

js/scriptaculous.js?load=effects

tag in my page, Sortable won’t work, because if I’m not mistaken Sortable is in a different file than effects. Is there a way around having to declare the same file twice?….or can i just use:

js/scriptaculous.js

which would reference all the scriptaculous libraries.

Steve-0 Apr 5th, 2006

I’ve solved my own issue…..

The ‘Element’ is undefined was due to the order of my .js declarations….I declared lightbox.js before prototype.js and scriptaculous.js, which resulted in Element not being defined since it wasn’t parsed at the time of lightbox.js loading.

It also seems that I can just use
js/scriptaculous.js
which loads all the scriptaculous libraries.

:)

Hans Apr 5th, 2006

Really beautiful and perfect for my little phot gallery.

Thank you very much for doing this. Great respect for people that make these incredible beatiful stuff without asking money for it.

a donation will be comming your way as soon as my site goes online just because you deserve it :P .

Thanks to you ones again

Greets Hans

Vectormonkey Apr 5th, 2006

Brilliant! Absolutely brilliant! I have used it to link to sets from my flickr account, and it works flawlessly. Thanks so much for your time, effort and generousity.

http://www.vectormonkey.com

Creighton Apr 6th, 2006

Hi,
This is a pretty remarkable script! I’m wondering why some people are able to get it up and running no problem, and who others seem to have similar problems? I have two myself:

1. Although it has been brought up a number of times, I can’t seem to get the overlay to come down over the image. I’ve tried to post

body{ margin: 0; padding: 0; }

in the body tag of my stylesheet, but then it seems to affect the entire page. Where exactly is this supposed to go? I am currently using a template CSS that has been validated, so I don’t want to mess things up. It’s not supposed to go in the lightbox.css is it? It would be much appreciated if someone who had success fixing this problem could go into a bit of detail for the rest of us.

2. Other than that it works very nicely in firefox, but in IE it doesn’t load the overlay at all, and creates a large area for the image to center itself in. The area is much larger than in firefox, and requires the user to scroll down and right to click the close box. Any ideas how to fix this? the example can be found at

Roel krottje Apr 6th, 2006

To prevent the dotted lines from being displayed when the PREVIOUS or the NEXT area is clicked, we somehow need to implement this feature in the lightbox.js script:

onFocus=”if(this.blur)this.blur()”>

.. But I can’t find where exactly… Any help would be apprectiated :)

Kind regards,
Roel

Roel Krottje Apr 6th, 2006

FIXED THE ‘dotted lines’ PROBLEM:

When you click in FF (and in some older versions of IE as well) you see a dotted line after you click the NEXT or PREVIOS area. Here’s how to fix it:

For NEXT:
Search for this peace of text in lightbox.js:

var objNextLink = document.createElement(“a”);
objNextLink.setAttribute(‘id’,'nextLink’);
objNextLink.setAttribute(‘href’,'#’);
objHoverNav.appendChild(objNextLink);

Put this after the third line (just above the last line):
objNextLink.setAttribute(‘onFocus’,'if(this.blur)this.blur()’);

That’s it. Do the same thing for objPrevLink:
objPrevLink.setAttribute(‘onFocus’,'if(this.blur)this.blur()’);

Hope this helps you guys out !

Regards,
Roel Krottje

Roel Krotte Apr 6th, 2006

Comment on post above:

The copy-and-paste action from my Notepad to this formfield changes the ‘ tag to a ` ta. Make sure you change it after you copy and paste the newly added line above into your lightbox.js.

Roel

RatSon Apr 6th, 2006

Hi do you plan to switch to prototype v1.5.0_rc0 (removed Array.shift() function would cause problems when it would just replaced)

RS

Tim Apr 6th, 2006

I like this new Lightbox Version :-) !!!

Just tested it on my side (2min of work). Only thing I noticed is that Opera do not support the bg-opacity. How about a transparent PNG for Opera instead?

Tim

Allie Apr 6th, 2006

Hello :)

Great work, but I’ve noticed 2 things:

1) I try to validate the CSS, but there are some errors.
2) Like Tim #219 I noticed that Opera do not support the bg opacity, so the screen becomes black.

Allie

russell Apr 6th, 2006

This is excellent work!!! Probably the most exciting innovation i’ve witnessed on the web in years.

The original lightbox script has been implemented in the gallery on my site at http://www.rootofsilence.com and as soon as I get some spare time (maybe this coming weekend) i’ll look at getting v2 on.

In the meantime I’ve noticed a small bug with the IE7 beta and the ‘image set’
On the first image of the set their is a gap between the ‘next’ button and the white border of approx 10/15 pixels. If you then move to the next image the gap appears on the ‘next’ but will dissapear if you mouse over the ‘prev’ although wil re-appear if you ‘mouse-off’ and then back over.

Also can anyone give any feedback on accessibility issues – I’m trying to convince my manager at work that this is fine from an acessibility point of view – but he’s having none of it…..

Bradley Spitzer Apr 6th, 2006

Hey, I just have to say that I LOVE Lightbox and that it has worked beautifully on my portfolio site.

http://www.bradleyspitzer.com

Kinetic Mix Apr 6th, 2006

Please could someone help me out. I have just downloaded the Lightbox 2.02 update and uploaded all the files to my website in a test directory but when I go to click on the picture on the test page that was supplied the image loads at the very bottom of the screen with no transparant overlay appearing at all. Would someone please mind taking a look at this for me to see what is going wrong. I don’t understand it as i have just used the downloaded files and have not made any modifcations. Thanks in Advance !! TJ

http://www.kineticmix.net/codered/index.html

marc Apr 6th, 2006

great, awesome! thanks!

Erby Apr 6th, 2006

hey, I love this script, works the best of any I have, have trouble with keyboard nav though. I think it may be a safari issue. –suggestion– another great update to do in the future, probly would be easy, but you could add a comments feature to the script. couple more updates and this script could rival flickr maybe. It’s super awesome.

Tim Apr 6th, 2006

Awesome stuff! Is there anyway you can configure it to automatically scroll through all the images if it is part of an image set – like show each for 2 seconds and move on? That would be really neat….

Art Apr 6th, 2006

So easy, so fast, so elegant. You’ve made the web a better place! A+

Will Apr 6th, 2006

I just updated to v2.02, its very nice thank you very much! you are amazing ;)

Will
http://www.willstumpf.com

giles Apr 7th, 2006

blog design is perfect. lightbox script a revelation. trying a mix with flickr. going for a sans flash nicholas grimshaw site. Thankyou.

zwicky Apr 7th, 2006

#223

Replace the following HTML tag in your page:

with

Fuzzy Apr 7th, 2006

Like #204, I too would like the ability to show Flash swf instead of a picture. Maybe pass a parameter in there somewhere to decide the type of content.

Onizuka Apr 7th, 2006

i’m testing the lightbox V2.0 for my crew website (http://www.mangajima.com). it’s really great but no resize for the pictures who are too big for the frame or IE/Firefox window. Is it possible to set this possibility? (like lightbox plus if my memories are good) (sorry for my bad english)

Robbie Done Apr 7th, 2006

Great work, what a breath of fresh air this is!

Simondo Apr 7th, 2006

#230

Could you please either email that

Simondo Apr 7th, 2006

#230

Bah, apologies for my previous post!

I have the same prob as #223 and need to know what change/s are needed to be made to the HTML if any???

http://www.simonturnerphotography.com

Top piece of code Lokesh!!

Phil Apr 7th, 2006

Someone did a great mod of Lightbox 1.0 to work with flash -

Can someone do it? I am no JS coder!

you normally call lighbox by adding rel=”lightbox” in html, but it doesn’t work with flash – so the flash mod let you call it like this:

“javascript:lightbox(“http://url.to/image.jpg”,”This is my caption!”;);

And it would work lovely as long you put the JS in the flash’s HTML file!

Please someone have a go! I’ve had a look and it’s different to 1.0

(great coding job btw!!)

Greg Apr 7th, 2006

Flash support would be excellent

bippym Apr 7th, 2006

great script, i want to call it from flash too tho, the old version does it right?

Bruce Gilbert Apr 7th, 2006

I love the script, however for me I can’t get it to work in IE6. Works fine in Mozilla, Netscape and Firefox.

I am using the script on this page:

http://www.inspired-evolution.com/AJAX_Images.php

any ideas why it may not be working in IE? I didn’t change anything from the download…

Anonymous Apr 7th, 2006

Simondo and Kinetic Mix,

The most likely cause of the behavior you are both seeing is that your lightbox.css file isn’t in the right path. Make sure that you have the lightbox.css in the expected path that you have listed in the HEAD section of your HTML. To test you can try moving the .css file into the same location as your HTML page and not specifying a path. (You still need to declare the lightbox.css though).

I’d describe better, but the blog really doesn’t like HTML code, which makes it difficult.

Sean

kwabe Apr 7th, 2006

I was wanting to know if and or how would one be able to load a swf, mov, or flv file in the lightbox. instead of image files

and thanks for the great tool

Michael Apr 7th, 2006

Great job on version 2. I have 2 small issues with it though:

First, the next and previous buttons are cool, but may not be obvious enough for the less “computer literate” people who use my page. I’ve made a small change to the script which adds more obvious links. You can see an example here: http://www.palintest.com/products/multiphot/7500 – I hope you would consider including this change in the next version.

Secondly, the loading image appears to be stretched when displayed in IE- any idea why this could be?

doxa Apr 8th, 2006

This is a really cool JS! I’m using it for my blog:

http://africa06.blogspot.com/

I really like the “Click to close” feature from ver. 1 of Lightbox. How can I implement that feature in ver. 2? (I’m not a JS writer) It would be useful especially when I’m using Lightbox for one picture at a time. When there are series of photos with separate thumbs (like in my blog), it’s tedious to move the mouse to “Close X” every time. It would be nice if I could close Lightbox just by clicking on the picture instead of the “Close X.”

Thanks for sharing!

Adding links to captions Apr 8th, 2006

I noticed that some of you wanted to know how they could add links to captions.

This is how I’ve done it and it works :
Visit site‘>details

in other words add a Visit site‘—–>to the a tag.
this is the link where you can check it out
http://www.awholeuniverse.com/portfolio.php

BTW did anybody succeed in validating the lightbox.css file?

Jay Apr 8th, 2006

I noticed that when I downloaded lightbox2.02.zip that the version in the lightbox.js file is 2.01

ryon Apr 8th, 2006

i love this.

jasperguy Apr 8th, 2006

I was playing around with the cssplay site with the simular lightbox gallery and just could not get it to work out. I was trying to avoid the javascript, but I think that is the way to go.

I like the way your examples are just the raw scripts, that way I can intergrate it into my projects much easier. Thanks for the hard work.

Micheal Apr 8th, 2006

is there any details on how you implemented the next and previous image to the script? nicely done btw.

Lokesh Apr 8th, 2006

#241 kwabe – Lightbox JS v2.0 is solely intended for displaying images. There are some modifications of v1.0 available that support other media: Lightbox v1.0

#242 Michael – Reset your cache in IE and see if the loading image still appears stretched. As for more obvious prev/forward links, it is something I have debated and might work towards in an updated version.

#243 – I’ve added some instructions on how to add links in the caption here: Lightbox JS v2.0 support

#244 Jay – The Lightbox JS 2.02 zip contains the latest files, I had just forgotten to update the version number in the script file.

#247 Micheal – For some insight on how I implemented the prev/next navigation look at the start() method of the Lightbox class and also review the html created in the initialize() method.

Lokesh Apr 9th, 2006

#219, #220 Tim, Allie – Opera doesn’t support the background opacity, but it holds up fine otherwise so I don’t worry. As for the CSS not validating, this is due to the clearfix rules. I’m not sure if there is equivalent validating code that.

#232 Onizuka – The Lightbox Plus modification allowed you to ‘resize’ pictures that were to big for the viewport, but it also required multiple images and hardcoding an array into your html. I’ve left out the feature for simplicity’s sake.

#236, #237, #238 – You cannot currently call the script from inside of a Flash movie, but if someone wants to work on adding that capability, please do.

bugzie Apr 9th, 2006

Here is a Drupal 4.6 Module available for download:

http://cvs.drupal.org/viewcvs/drupal/contributions/modules/lightbox2/?only_with_tag=DRUPAL-4-6

Los Apr 9th, 2006

Is there a way to attach mouse events to the image container div?

Tiggr Apr 9th, 2006

>#242 Michael – Reset your cache in IE and see if the loading
>image still appears stretched.

It’s the same for me, getting a streched loading image in IE6 and IE7, even after cleaning the cache!

Matt Apr 9th, 2006

Hallo!
This lightbox JS v2.0 image view is the best I have tried. but i have some problems, my homepage is using ifram so when i run the script the image opens in the ifram but i want it to open on the whole page, how do it do that?
please help me!

Rom S Apr 9th, 2006

Thanks again Lokesh, for such a fantastic script!

I’ve finally been able to add all the pieces I wanted, like links and auto-resizing to fit the browser if the image was too big.

You can see it working at:
http://romsrini.name/flickr/set_album/1739364

The resize code may be ugly, since I don’t know javascript very well, but it seems to work:

in the ‘changeImage: function(imageNum)’ function, i just modified the second half:

// once image is preloaded, resize image container
imgPreloader.onload=function(){
Element.setSrc(‘lightboxImage’, imageArray[activeImage][0]);

//resize code
var arrayPageSize = getPageSize();
var targ = { w:arrayPageSize[2] – (borderSize * 2), h:arrayPageSize[3] – (borderSize * 6) };
var orig = { w:imgPreloader.width, h:imgPreloader.height };
//// shrink image with the same aspect
var ratio = 1.0;
if ((orig.w >= targ.w || orig.h >= targ.h) && orig.h && orig.w)
ratio = ((targ.w / orig.w)

Rom S Apr 9th, 2006

Just finishing up the code from the last comment:

if ((orig.w >= targ.w || orig.h >= targ.h) && orig.h && orig.w)
ratio = ((targ.w / orig.w)

Rom S Apr 9th, 2006

Sorry for the repeated comments, but one of my lines of code seems to causing issues with comment formatting:

var new_width = Math.floor(orig.w * ratio);
var new_height = Math.floor(orig.h * ratio);
photo = document.getElementById(‘lightboxImage’);
photo.style.width = (new_width)+ ‘px’;

myLightbox.resizeImageContainer(new_width, new_height);
}
imgPreloader.src = imageArray[activeImage][0];

Revanta Apr 9th, 2006

Could anyone tell me if there’s a way to change the color of the text for the “title” of the images? I can’t figure out what CSS property to modify.

I’ve tried creating a class for the img and putting a text-color attribute to it, but that hasn’t worked for me.

Would appreciate some advice.
Thanks!

Revanta Apr 9th, 2006

NEVER MIND!
Found the #image data caption property right after I posted my msg. Sorry!

Quola Apr 10th, 2006

This is a little unoriginal but… this script really is amazing. Total AWSOMENESS. Thanks so much for sharing it! I was wondering if anyone could help me? Flash seems to come in front of the lightbox. I’m an amteur and kinda clueless about what to do. I’d really appreciate it.

Chris F Apr 10th, 2006

Would love to see an auto resize feature implemented in this, like with lightbox plus. A lot of user uploaded images are bigger than the screen unfortunately which is why an auto resize to fit the screen would be really useful.

It looks great though, keep up the good work.

Quola Apr 10th, 2006

Wow, nervermind, I found out how to solve my problem, but it would be nice itf it would work in Firefox as well. Oh well. Thanks again for this fantastic script.

Catharsis Apr 10th, 2006

If your images aren’t loading correctly (loading, closelabel), check the .js to make sure the paths in the config section are adjusted relative to the page, not the .js file.

In other words, if your images are in /images and your js files are in /js, the paths to the images don’t have to be “../images/loading.gif” and so on… it’s just “images/loading.gif”. Silly error, but took me a while to fix. Hope it helps!

Kirk Apr 10th, 2006

Just started using v2 and the changes are superb. I’ve noticed the script runs noticely slower in Firefox compared to IE6 but I expect that’s due to the extensions installed or perhaps firefox needs to be restarted. Just wondering if anyone else has noticed any slowdowns (mainly in the fading in/out).

Thanks for the awesome script.

C.S. Heng Apr 10th, 2006

Awesome script. It rocks. and Thanks for such a good work!

matic Apr 10th, 2006

I also have the ‘loading.gif’ spinner image stretched issue in IE6. Can’t seem to pinpoint why. Any ideas?

Jeff @ equivocality.com Apr 10th, 2006

Amazing work, Lokesh!

I only have two suggestions:
1. Instead of loading the image directly, load the image as a background in a table cell, with a transparent overlay gif. That way, people have a bit of built-in image piracy protection (My pictures are constantly being hotlinked from my server to their myspace pages). I know it won’t stop people who REALLY want to get to the pictures, but it’s an extra step that I think would stop the majority of the stealers.

2. Perhaps have a lightbox “lite” version, or transitions that can be configured in the javascript: I much prefer the simple version 1 for my usage. The fancy transitions are beautiful, but render rather choppy on a few computers I’ve tested it, especially high resolutions like 1920×1200.

EgOiStE Apr 10th, 2006

Love the lightbox. Tried using 2.0 with the Lush theme but I think the Body load command is making it not work, even after including your modification to the body tag. Just an FYI for anyone else out there reading the comments.

doxa Apr 10th, 2006

Somehow my post (#243) dissapeared for a bit, and reappeared, and was never answered. Can anyone answer my question? (i.e. how do you make it so that lightbox will close upon clicking the actual image, not just the “Close X” button? It used to do this in lightbox v.1) Thanks!

Olle Apr 10th, 2006

Hallo!

I have some problems, my homepage is using ifram so when i run the script the image opens in the ifram but i want it to open on the whole page, how do it do that?
and how do i do to automatic reseiz the images to fit the window?

Onizuka Apr 10th, 2006

thx Lokesh and Rom S

rul Apr 10th, 2006

Hi!
congrats for lightbox 2.0 it’s cool!!

I’ve set up it in my blog and i have a little problem, the problem is with youtube embed player (a flash player), when zoom a image the player is in the top, hiding part of the image.

I’ve tried the solutions i’ve found in this and other sites, with no luck.
Any idea??

Thanks

Wizz Apr 10th, 2006

Lightbox v1.0 was amazing, but v2.2… Astonishing!

Great work! :D

Thanks!

Revanta Apr 10th, 2006

Does anyone know how to make aa quicktime video work inside the light box? I have the lightbox open an simple html page with an embedded quicktime video but all I get is the Q icon with a “?” in front of it. I’ve checked and I’m sure that the path to the video is correct.

Here’s the code i’m using in the html page:

Would really appreciate some help.
Thanks.

Revanta Apr 10th, 2006

Ok, guess I can’t post html code in the blog.

Anyway, this is what I tried to show video in the lightbox:
embed src = … width = 320 height = 260 auto play, etc etc with all the standard quicktime embedding code in a simple html page.
The page displays but only a Q symbol with a ? in front of it.

Help please!

Anonymous Apr 11th, 2006

is there somethin wrong with the page maby?
my downloads wount start and yeasterday the whole site was offline..
atleast i think so, im behing a shitty-freggin-admin-cant-configure-his-network-properly school proxy, just tell me the webpage is fine and ill go teach him some things

jasperguy Apr 11th, 2006

So I finally came back to this page! whew. I was reading 248 and wanted the same feature. Rom has implemeted on his flicker site. I looked in the lightbox class, and found this:

“If image is part of a set, add siblings to imageArray”

Does that mean I have to name my images in consecutive numbers for the next and previous to show up in the caption area? And will the links be activated?

Braindread Apr 11th, 2006

Could some one possibly try to up the lightbox2 zip file on yousendit.com or any other website, so i could try to download it..Im making a school projekt and would really need it

iv been surfing google for a while now and all the links seem to go to the original page, wich i cant seem to get to work

shortly Apr 11th, 2006

I have a problem, the close image and loading image are not displaying. area is still clickable for close image. prev and next images loading fine. i’ve waded through the code as best i can but can’t find anything askew…

also clicking outside the lightbox doesn’t return to the page.

same as for #200 Talguy
checked #263 suggestions but no help

anyone else got any thoughts on this?

webpage here if anyone wants to check.
http://davidandjacob.com/art/media/pics/

btw, i love this script. thanks for all the hard work.

shortly Apr 11th, 2006

ok. scratch that.
#263 was right… i ended up putting in an absolute path to the images and it worked fine. for Talguy #200 i suggest you try the same. the confusing part was that the CSS references the prev/next graphics relatively and works (because CSS is linked?) but the JS places the code in at the directory level the page loads at (at least that’s how i’m thinking about it) and therefore doesn’t work with a relative path.

eeeek.

thanks again.

oh. the clicking outside lightbox only works above and below to return to page – not on the sides. is this how it should be working?

Benjamin Apr 11th, 2006

This script is definetely awesome. I was looking at discussing it on the upcoming ajax section of http://rubyonrailsblog.com along with some other ideas we had for JS. Very cooL!

Neil Apr 11th, 2006

So impressed with the original I switched all my photos to this within 48hrs!
In V2+ How can I change the location of the next / prev indicators ?
I wanted to put them at the foot of the image preferably in the caption area so the picture is clutter free.
Many thanks

Jeroen Apr 11th, 2006

how can I change the position of the image container?
where do I need to make changes in the css?

Many thanks

Zach Apr 11th, 2006

Hi all, first wanted to say what a great script! Having a little issue with it though. I’m trying to incorporate it with a random image script I have and have gotten the popup to work, but can’t get the title to work. On my site, http://xhtml.shotland.com/portfolio/ on the right sidebar where my featured sites are located if you click on the image lightbox will open up, but not put the title of the page there. The script I’m using is: http://xhtml.shotland.com/js/projects1.js. I’ve tried various ways to get the title to work, but haven’t had success. Does anyone have any ideas? I’d greatly appreciate any help. Thanks

Xander Apr 11th, 2006

I am having trouble getting LB to work period. I am using a template but I am not too sure how to set it up using a template I always see it setup on single pages. If anyone can help me or give me a link to a website I would be very thankful. Thank you for your help.

Prophet Apr 11th, 2006

Having a bit of trouble getting the Prev / Next buttons to display.
I’m running IE6 with Dean Edwards’ IE7 JS Patch, so I can use “position: fixed;” on other elements of the page (not LB).
The prev/next links are functional when clicked, but they do not display. It works in FireFox, so I know my JS and CSS are right…but not IE6.
Any suggestions?

turk Apr 11th, 2006

i took that #255 did and expanded on it.
check it out here.
http://www.turk-182.com/eMortal/index.php?section=album&a=11

It resizes images to screen and then puts a zoom button at the bottom right.
Just check the source and grab the js file along with the lighthouse.css for the added class.

jasperguy Apr 11th, 2006

#280 – I guess you got it to work, great. Just a note if your js file and your css files are in different folders, and you use a relative url, you should remember to use this “../” (dot dot fwd_slash)to call it to the main root of your web files. So something like this: “../js/lightbox.js” or for the images “../images/next.gif” . Correct me if I am wrong, if you use an ablsolute url, you might run into the trouble of the quotes in the js scripts. Like the caption area when you need to put a link.

Thanks for updating the next / prev issue on the support page! The “[imageset]” is genuis, so simple to add.

Would like to attack the same issue as #282 now.

Jason palmer Apr 12th, 2006

#283…

I have the same question. I’d like to move the “popup” down a bit to match the layout of my webpage.

i do love this script.

Roel Krotte Apr 12th, 2006

Arrow Keys functionality in IE and FF.
———————————
For those who’d like to add ARROW KEY functionality (left / right) for navigation purpose, here’s how to do it:

In Lightbox.js, search for the keyboardAction function:
————————————————-

keyboardAction: function(e) {
if (e == null) { // ie
keycode = event.keyCode;
} else { // mozilla
keycode = e.which;
}
key = String.fromCharCode(keycode).toLowerCase();
if((key == ‘x’) || (key == ‘o’) || (key == ‘c’)){ // close lightbox
myLightbox.end();
} else if(key == ‘p’){ // display previous image
if(activeImage != 0){
myLightbox.disableKeyboardNav();
myLightbox.changeImage(activeImage – 1);}
} else if(key == ‘n’){ // display next image
if(activeImage != (imageArray.length – 1)){
myLightbox.disableKeyboardNav();
myLightbox.changeImage(activeImage + 1);
}
}
},

Change the above function to this one:
———————————-

keyboardAction: function(e) {
var keyCode =
document.layers ? e.which :
document.all ? event.keyCode :
document.getElementById ? e.keyCode : 0;
key = String.fromCharCode(keyCode).toLowerCase();
if((key == ‘x’) || (key == ‘o’) || (key == ‘c’)){
myLightbox.end();
} else if(key == ‘p’ || keyCode == 37){
if(activeImage != 0){
myLightbox.disableKeyboardNav();
myLightbox.changeImage(activeImage – 1);
}
} else if(key == ‘n’ || keyCode == 39){
if(activeImage != (imageArray.length – 1)){
myLightbox.disableKeyboardNav();
myLightbox.changeImage(activeImage + 1);
}
}
},

Now you’ve got full ARROW key functionality in both IE and FF.
Good luck !
Roel.

Carlos Apr 12th, 2006

Hello, I have the same problem than #191 Brian.
Flash shows on top of the image. I read what he did but I did not understanded it. Can you help me?

Michel Bozgounov Apr 12th, 2006

Great piece of software! One of the best “Pure XHTML/CSS/JS galleries” I have ever seen! Thank you! I am eager to try on my own website http://www.lelion.info one of these days, when I finally will have some time to design for MYSELF ;-)

Thank you again!

I see btw, PNG is not working in IE 6 (as expected;-), would be nice when IE 7 will appear (final version), I think:)))

Good luck! And thanks again!

Michel

Neil Apr 12th, 2006

#290
Thanks for the key controls. Sound addition.
#287
Like the lightbox plus (resizing) functionality, but can’t view your source or get .js. How do you ‘de-size’ expanded image?

Just need to get #282 sorted now.

This is actually fun!
Thanks all

Jasperguy Apr 12th, 2006

#290 Roel, great post to quickly plug and play, just tried it and it works 100%

#293 same with neil, would like the feature of next and previous in the caption area, so that it is visible for the less “web savvy” visitors.

Thanks

turk Apr 12th, 2006

#293 not sure why you cant see the js
http://turk-182.com/eMortal/js/lightbox.js and i didnt do a shrink function. when you click next/previous it shows it resized again.

Neil Apr 12th, 2006

#255 Rom S
Seems to have got what I was after (#282) sorted.
Will he share the secret?
#295 turk
thanks got the js ok

Neil Apr 12th, 2006

#295 Turk
Sorry, got the js but what are the additional css modifications?
Thanks

derek pennycuff Apr 12th, 2006

i’m using lightbox2 for my wife’s photography site. i’m gonna try to mine some extra controls for it from meyer’s S5 to put additional keyboard functionality into the navigation. i’ll send you anything i produce that proves to be useful.

Neil Apr 12th, 2006

Further to #290 Roel
At the line (in his code)…..
if(key == ‘n’ || keyCode == 39)
which looks for the letter n or the right arrow to go to next image.
Modify to read
if(key == ‘n’ || keyCode == 39 || keyCode == 32)
that will allow you to also use the space bar to go to next image.
Also to save you looking code 38 is the Up arrow, code 40 is Down arrow.

Aryana Apr 13th, 2006

This is really nice! I think I’ll use it for my portfolio. I love how it’s so easy to implement and customise :)

Cat Apr 13th, 2006

Lightbox JS v2.0 is very nice!!
However,can i apply this effect in homepage with frames?
When i click the thumbnail picture,the effect only shows in the same frame. Can it show in the whole screen and keep all the frames constant?

Nick Toye Apr 13th, 2006

Is it possible to have the close button a rollover button?

Can I have the back and next buttons more obvious and not hidden in the picture, I would like to have them alongside the close button.

Cat Apr 13th, 2006

It is the problem i mentioned before:

http://hk.geocities.com/catgirl616/page.htm

Justin Apr 13th, 2006

Same problem as a few others. Close button and loading don’t work. I have the paths as “images/loading.gif” and “images/closelabel.gif” but still nothing.

http://justin.ani-6.com/

thanks if you can help!

Paresh Apr 13th, 2006

In response to #302 from Nick Toye:

I also wanted the Next/Prev to be permanently displayed and have tried the following CSS change (lightbox.css):

#prevLink { left: 0; float: left; background: url(prevlabel.gif) left 0% no-repeat;}
#nextLink { right: 0; float: right; background: url(nextlabel.gif) right 0% no-repeat;}
#prevLink:hover, #prevLink:visited:hover { background: url(prevlabel.gif) left 0% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(nextlabel.gif) right 0% no-repeat; }

Basically, I added the ‘background’ property to #prevLink and #nextLink.
Also, I changed the location from 15% to 0″ which puts them in the upper left/right corners of the screen.

You can try playing with the same properties if you want to locate it elsewhere.

Thanks Lokes, WONDERFUL piece of code!!!

— paresh

AK Apr 13th, 2006

Thanks much. Can I use it on my site, any licensing needed?

jasperguy Apr 13th, 2006

#308 Justin,

If you are going to leave a link to show us the problem, perhaps you should have that demo running. My guess is that you should try and read #288.

#305 Paresh

Can we have a link to see what you have done?

Nick Toye Apr 13th, 2006

#305 – Cheers Paresh,

Can we add a caption to the set rather than just the title when we use grouped images?

Joost Apr 13th, 2006

Question …
How can I implement this great tool into http://www.simplephpblog.com ??

Eddie Apr 13th, 2006

@ Paresh #305, or anyone who’s tried. I’ve tried to add the next and prev buttons, but to stay constant iin an image set, but am only having luck with the prev button. I still have to hover for the next button. CSS is right on. Any advice?

Anonymous Apr 13th, 2006

Has anyone found a way of:

#1 – Adding a rollover effect to the close button
#2 – Adding the value that is in the rel tag as a set title in the image

Sandeep Singh Kunwar Apr 13th, 2006

Funtastik Stuff!! Must Appriciate ur work.

but missing badly a essential feature !!
If some one wants to just sit & enjoy ur creation, their is no way, we have to use keyboard or mouse.
I wish it works as a slideshow :-D, switching images itself.
Just sitting and enjoying is the stuff we used to like ;-D

Thanks a lot!!
Waiting for positive response.

turk Apr 13th, 2006

#297 heres the css
#imageData #bottomNavZoom{ width: 34px; float: right; padding-left:15px;padding-bottom: 0.7em; }

Scot Apr 13th, 2006

#305 … it’s actually even easier than that …. remove the :hover and the prev next will become perm. I’ve been using it successfully with ie6/ie7 and firefox with my blog since the initial 2.0.

Nick Toye Apr 14th, 2006

#314…Scot, that’s good, but do you know how we can get the prev and next buttons next to the close button?

Digit Neave Sony Mazda Apr 14th, 2006

Holy smokes! It’s SWEET! I’m making the site http://www.digitnsm.com (should be online by July) and I used this for pictures. My brother’s eyes went YOINK and he’s like WOAH WHERE’D YOU GET THAT! Thanks so much Lokar

Alconis Apr 14th, 2006

I’ve just released a DotClear plugin adaptation of LightBox JS v2.02. Very nice work ! Fully integrated and using wiki syntaxe to generate LightBox links. To see what is dotclear go to dotclear.net. I could not find how to make a trackback to this article. So here is my article about the plugin.

http://www.alconis.com/dotclear/index.php?2006/04/14/116-lightbox-js-pour-dotclear

Watch out ! This is written in french.

Keep up the good work !

Michelle Apr 14th, 2006

Wonderfull script. ^_^ Very much worth the effort it’s been to integrate it into my site. Thank you so much for sharing.

Imaginaryday Apr 14th, 2006

is there a way to add an exif data function support to this marvelous script …

Andrea Apr 14th, 2006

Version 2.02 doesn’t work properly in Firefox 1.5.0.1 on a Mac under OS X Tiger. Whenever I click on the example gallery thumbnail images, it throws the larger images into a new page instead of overlaying the current page with the larger image. The older version of lightbox (version 1) works properly in the same browser.

I tried lightbox 2.02 in Safari on the mac and it worked great. And it worked fine in Firefox on the PC. But I need it to work in Firefox on the mac too.

Paresh Apr 14th, 2006

#307 jasperguy, #310 Eddie:

I’m still testing various options, but for a temporary work in progress, see one of the two links below:

http://www.oopalioperajita.com/gallery2.html

http://www.oopalioperajita.com/gallery.html

If you dont find one link, try the other. I am in the process of editing that site.

#314 Scot: you are right. But I left the hover in there, in acse I want to revert back to the original.

#310 Eddie: I think it’s probably a typo in your CSS. If you’re seeing PREV and not NEXT, you probably forgot the CSS for next. See #305 for details.

Tracey Apr 14th, 2006

FWIW: This is really not an ad, just something that may appeal to others- JAlbum (http://www.JAlbum.net) is a rather superb freeware product (any OS-it’s Java based) to make web albums of digital photos. It offers over 100 (also free) “skins” to create completely different image albums. The main point here is, the “ShowLite” skin (sample at http://www.taskmine.com/JAlbum/ShowLite/) makes use of Lightbox to “easily” produce photo albums of any size . A new version using Lightbox 2.02 should be out next week.

baZzz Apr 14th, 2006

Wow, great stuff! Keep it up Lokesh!

I liked some of the fixes/mods/hacks that were mentioned here on the comments page, so I integrated them in a default Lightbox 2.0.2 installation to save the people who like them as well some trouble. These modifications are:
* Auto resize of images larger than browser size, by Turk [#287]
* Keyboard navigation by means of arrows, spacebar and backspace, by Roel Krotte [#290]
* Fix that prevents images (in FF) from displaying dotted lines around them when clicked, by Roel Krotte [#216]

Just for reference, I call this Lighbox 2.0.2+ (Catchy name, huh? ;-)

I zipped them up together with some more example images in this file here: http://baZzz.com/lightbox/lightbox2.02+.zip

Enjoy!
-Bas

Son! Apr 14th, 2006

Skiping Pictures…when clicking on Next

I would like to know if anyone else has this problem and how to solve it, for exemple, I had 10 pictures on a site, and once i clicked the next button, it will go from the 1st the 3rd, 5th, 7th, and 9th picture skiping one in between! is there any way to resolve or finding what’s causing this?

I just love this script,

taare Apr 15th, 2006

You should set the color property in the css to #000 or something. I had set my default color to white, and couldn’t see the caption e.t.c. for my images. Otherwise, it’s a excellent script.

Glenn Apr 15th, 2006

Lokesh, excellent work. I just started using ver 2 and am very impressed.

I trolled the comments but only saw 1 reference to my issue – is there anyway to do different text styles within the captions? Such as bold, italics, etc.? Thanks for the great work.

- Glenn

jasperguy Apr 15th, 2006

#314 Scot – Thanks scot, easy mod.

#321 Paresh – How did you get the prev / next to the top of the image?
nevermind you answered here: #305.

Thanks Paresh, I think I’ll be satified with the prev / next at a different location at this time, until I can get it to the captions area.

#310 Eddie, I thought I had it wrong too, but it was the relative url to your image. Check the CSS carefully.

#324 Son! – did you name all the images in the same set the same? ie: rel=”lightbox[baldhills]”

Pixie - Incorporate Into eBay? Apr 15th, 2006

Hi Guys.. Anyone Know how to get this to work with ebay?

Ebay does not allow some javascript commands. i get this error / warning when I create the listing.

Your listing cannot contain javascript (“.cookie”, “cookie(“, “replace(“, IFRAME, META, or includes), cookies or base href.

Any help is appreciated.. My AIM Nick is MagicPixels2004.
Any Help is appreciated.

kimonostereo Apr 16th, 2006

Nevermind,
I figured it out! It doesn’t work if I have Amazon.com’s beta code for roll overs! DOH. sorry for the trouble! Thanks for a great script!

Jon Apr 16th, 2006

i’m trying to get the lightbox to go to the top of the page, with no margin-top. the css specifies position:absolute and top: 0px, but it still has about 50px or so above it. anyone have any ideas? thanks!

Jon Apr 16th, 2006

forgot to add… the body is set to padding:0px and margin:0px

Koka Apr 16th, 2006

@lokesh:
a question: why are there two image files:
close.gif AND closelabel.gif
?

TheHYPO Apr 16th, 2006

I have 3 minor issues with the script. On certain images (I have no idea what is special about those images) the caption box ’snaps’ a (maybe half a dozen pixels) wider after ‘dropping down’ at the proper width (this occurs with your script right out of the box, without and adjustments to the code or css).

Secondly, the script won’t show ‘&’ characters in the caption (if if & is used).

I changed the ‘close’ image to something smaller, and changed the css width for that div, but the new image is resized to 66×22 (the original close image size). I can’t find any reference to those dimensions in any of the scripts, so is there a way I could get that to display properly?

Talguy Apr 16th, 2006

#263 thansk alot I know you posted that a while ago but I haven’t been on a lot. That was a stupid error and after I changed the path it worked fine, Thanks again.

TheHYPO Apr 16th, 2006

Re: my last entry –
- I solved the ’snapping’ issue.
- Apparently the issue with the ‘close’ button resize is not an issue in Moz… just in IE (6 is what I’m using). I’m not sure why IE is sticking with 66×22px
- I haven’t been able to solve the ‘&’ problem. Any thoughts?

you can check my setup
http://www.rockitoldschool.com/overl/gearinfo.php?gear=1

TheHYPO Apr 16th, 2006

D’oh. I feel like a jerk but I ’solved’ the close-image issue too (I didn’t do anything, it’s just working all of a sudden – I think it might have been cache-related or something.

So now I’m down to the ‘&’ issue

tg Apr 16th, 2006

#337, hyp

check this list for “&”

http://www.ramsch.org/martin/uni/fmi-hp/iso8859-1.html

Andrea Apr 17th, 2006

Version 2.02 now works just find in Firefox 1.5.0.2 on a Mac under OS X Tiger. I upgraded FF today from 1.5.0.1 to 1.5.0.2 and now all is well with the latest lightbox.

Johnnie Apr 17th, 2006

I loved Lightbox JS and immediately implenmented it to my blogspot @ blogger – I came here to see the new version which haas great features I would like to use but for some reason cannot implement this v2.02 to blogspot.

Doesn’t like the title=”" tag.. has anyone been able to implement v2.02 to blogger.. please let me know. Thanks.

nonagon Apr 17th, 2006

Check out this image gallery which uses Lightbox 2.02. Thanks Lokesh; it works perfectly!

http://www.washingtonocg.org/towson2006/gallery.htm

Garrett Apr 17th, 2006

Geocities Issue:

I have a free geocities site that I display pictures on. All of my other javascript works fine, but LightBox doesnt seem to work. It works offline however so it is setup correctly I believe. When I click an image it appears to want to work for a second by showing the loading gif but then opens the picture in a separate window. Any advice???

Garrett Apr 17th, 2006

I should have originally posted the site to show the issue Im trying to describe… its http://www.geocities.com/garrett_burnell/engpics.html . Sorry

Sjon Hortensius Apr 17th, 2006

When you have resized your body (like I did) IE will incorrectly think your ‘100%-width’-overlay and ‘100%-width’-lightbox are that resized body size.

You can fix that by changing the width’s for IE to the following:

#lightbox{
width: expression(document.documentElement.clientWidth + “px”);

}

#overlay{

width: expression(document.documentElement.clientWidth + “px”);

}

celia chen Apr 17th, 2006

can this be used in MSN blog?
i tried on mine, but from the header part,i failed.
please reply me with a email, and i will be very appriciated thanks a lot

Rene Apr 17th, 2006

Hello, Im using the wp-plugin for lightbox..I figured out that it works..(Hooray!) but NOT when i activate another plugin that i use: EditorMonkey (WYSIWYG-editor)…How do I manage to get them both working…Don’t have a clue what EditorMonkey is causing wich fails to load the lightbox feature….Can anyone help?

(my blog is: http://brokenbinary.org/freakatwork/)

Greetz,
Rene

Li-An Apr 18th, 2006

Hello, it’s a great work but I’ve got a similar problem than Rene. I use the Dotclear plugin (see #317) and Lightbox blocks my phpMyvistes http://www.phpmyvisites.net/index.php?part=accueil&lg=en javascript code (when I delete the Lightbox code lines, phpMyvistes works again). Somebody to help me ?

Another strange problem: as I’m french, I changed the “n” shortcut for “next” with “s” for “suivant” (next in french) but it does not work (I changed “c” for “close” with “f” for “fermer” and I have no problem with this).

Onedots Apr 18th, 2006

Hi, mine doesn’t work at all after following all the steps. It just shows the title text and when I click it, the image comes out on another page. Can someboday help me?
This is my sample page

St3phan Apr 18th, 2006

Is it possible to make the navigation always visible? If possible, could anyone point me in the right direction on how to do this?

charlie-imac Apr 18th, 2006

Question, if you look at this page – http://63.134.238.55/seasonHints/seasonHints.html you will see that I am using javascript to load each “page” into a div.

Now, if you look at this page you will see that I’m using Lightbox but I would also like to use the other javascript to load each of the pages into a div for Annuals Perennials Trees Shrubs.

http://63.134.238.55/plantDatabaseImages/annualsPlantDatabase.html

Anyway to do this? I have three other sites, one for another landscape designer, one for a pet photographer, and the other for a people photographer. I like the javascript more than flash.

I would appreciate any help.

charlie-imac

Fabrizio Calderan Apr 18th, 2006

Why not create also a light/packed/compressed version of javascript code?

I think you could reduce it until 50/60 Kb and maybe less. By the way this is a very nice script… great!

Fab

Garrett Apr 18th, 2006

CHARLIE IMAC:
Excuse the caps, its just to get your attention. I was looking at a script from dynamicdrive.com (http://dynamicdrive.com/dynamicindex4/photoalbum.htm ) and came across something that looked similar to what you are currently using (the page that uses javascript to load a new “page” into a div). I was wondering if you might be able to fix your problem by tweaking the given code to insert a ‘rel’ tag for the images (in the arrays framework), thus allowing you to also use Lightbox. I am by no means a javascript person, but saw this and was wondering if it might be helpful.

Garrett

Paul Apr 18th, 2006

#349 charlie-imac:

Refer to #143, thanks to Vladimir.

#143 Vladimir
April 1, 2006 @ 5:43 pm
to #132: after you change the innerHTML of a div, run initLightbox()

I think that you are having the same problem I was having… hope it helps.

Big Al Apr 18th, 2006

Sorry to be a noob, but how can I insert a line break before a link in the caption (in Firefox)? I’ve seen Lokesh’s notes: Image

In my title, I’m picking up a variable (comments up to several sentences long) as follows: title=”$variable <a…as above” This is working well in IE, but Firefox is displaying and my link info.

Otherwise, this is fabulous, thank you for sharing.

Big Al Apr 18th, 2006

Brilliant. sorry about the “image” link above. Lokesh provides a way to add a link in the caption: http://www.lokeshdhakar.com/projects/lightbox2/

I just want a line break (I did try & # 6 0 ; etc., but that didn’t seem to work).

Da Scritch Apr 18th, 2006

I looooooooove thoses functions but, as I wrote it there in French http://dascritch.net/blog.php/2006/04/19/381-lightbox-v20-trop-joli , they are just too clean for not having problems.
I translate here my “buglist”;

1- not easy to localise “Image # of #” except if you can read the code
2- Can’t accelerate^W unactivate the animations
3- No URL bookmarkable for the galleries
4- Neiher for the image in the gallery context
6- Can’t switch to fullscreen, outside gallery context
7- No resize of the picture if too large/tall for the viewport
8- Comments are at the bottom (th hardest to modify IMHO)
9- Unavaila^W Available shortkeys not evident for non English speakers
10 – too much javascript (but I will modify my website, so i’ll reduce them)

see the page for more details

Christian Apr 18th, 2006

Great app, but the closelabel and loading images doesn’t show up on every page because of the relative image adress used by lightbox. Which of course is plain stupid! Coders, what were you thinking?! We all have blogs nowadays with individual pages, front pages, archives etc all with different folder-structures. Then relative paths does NOT WORK!

Please fix this!

turk Apr 18th, 2006

ok here is something i really want. a way to invoke the lightbox from a link so if i want to link to my gallery and have an image pop up in the lightbox auto.
like if my link is
http://www.turk-182.com/eMortal/index.php?section=album&a=11&f=IMG_6215.jpg

it will load the page and then invoke the lightbox to show IMG_6215.jpg
anyone have any ideas ?
i cant seem to figure an easy way to do it.

Isaias Loaiza Apr 18th, 2006

Hi man!!!, fisrt of all i want to say congratulation for your script, its fantastic… really

i am using it in my blog (www.isaiasloaiza.com) and i am trying to custumize on thing…

in an ‘image set’ is there a way to change the text “Image 2 of 2″ for “Imagen 2 de 2′

I want to put it in spanish because my blog is in spanish…

Can you help me? in what page or code do i need to enter?

THANKS FOR YOUR HELP!!!!

Richad Apr 19th, 2006

Kudos. Yeah it has some shortcomings but the slide show is an excellent addition to the original concept. You allowed me to remove a number of separarate photo pages. Keeping the visitor “in-line” on one page is cruicial to a pleasant viewing experiece. THANK YOU!.

Now that I’ve stroked you, :-) here’s my requests for the next version. Both are imo very important.

IMAGE RESIZING on the fly
Put a 2nd variable in the REL attribute: size expressed either in pixels or percent. eg [width:640px] or [width:50%] or [height:740px] or [height:50%]

Only need to specify width or height, not both (proportional resize). This is needed because often the same image is used on more than one page but at different sizes.

NAVIGATION
A commentor above was rather harsh. I used to code so I know things sometimes turn out awkward in the heat of the battle. So no dings from me. Just a request to clean it up.

Don’t think the hover is a good idea. Not intuitive or explicit. So what I’d like at bottom of photo is:

Caption on first line by itself.

2nd line with:
* Image n of n DIV (float left)
* navDiv (float right)
***navPrevious link
***navNext link
***navClose link

Each nav link having a background image (easy to change)

Garrett Apr 19th, 2006

Geocities issue:
I’ve looked all around (the code and the net) and cant find a solution to why LightBox wont work on my Geocities site. Sorry to post this again (its the last time I will bring it up), but can anyone tell me what might be the problem. here is the page with the issue

http://www.geocities.com/garrett_burnell/engpics.html

Thanks for any help

Koka Apr 19th, 2006

hm, these brackets [, ] aren’t allowed in xhtml1.1

Koka Apr 19th, 2006

… in the
rel=”lightbox[roadtrip]”
attribute

Christian Apr 19th, 2006

Hi,
Good work!
Would it be possible to incude the maximize feature in 2.02 as it is in Lightbox Plus?

Christian

m0n Apr 19th, 2006

everything is working fine for me except no captions for titles are showing.
any ideas?

Scott Apr 19th, 2006

I normally don’t like to be mean, but #356; dude, fix it yourself! I don’t see anything that needs to be fixed by the developer … just change out the realtive links for hard coded links.

iLYA Apr 20th, 2006

function getPageSize() in IE|Win|6 appear to report the width correctly only if the margins of the page body are set to 0. It’s noticeable, when the overlay has different color than the page background, so in order to add some space to page contents, one has to add a wrapper div to apply the desired margins to it. Not a biggie, excellent work otherwise!

Michael Apr 20th, 2006

Can I show multiple images in 2.0 by using only 1 image or do I need to show all the images on the page as thumbnails.

I am trying to get away from showing a lot of thumbnails.

Example:
http://www.digitalcameratracker.com/archives/2006/04/18/hp-photosmart-r927-sample-pictures.html

It would be great to have one image and once clicked then the other images would be included in the slideshow.

Is it possible?

Los Apr 20th, 2006

Wow, you seriously need forums! :D

Dan Apr 20th, 2006

Agreed^ :)

Dustin Apr 20th, 2006

Is it possible to have the ‘next’ and ‘previous’ buttons shown at all times? Or is there an easy way for me to move them to the bottom of the image window?

Our company looked into using your script on a few sites, but found that without this modification, it would be better to pass(for now)…

Thanks, and great work!

Steven Roussey Apr 20th, 2006

It would be great if it limited itself to the size of the window. Accidentally using a large image screws it all up! Great script!

Eduo Apr 20th, 2006

(Wow, whatever broke the format for the comments makes clicking in the “name” field try to load a JPG. Ugly. Maybe closing the tag (… …)

Now, my comments.

First of all, Lightbox is fantastic and I secretly thank for it having only a single uppercase letter, I can imagine you forcing yourself not to do the trendy LightBox thingy :)

Now, I had entered to ask about how to reload lightbox when divs are added through XHR, but that’s been answered already. I also wanted to ask about links working as images do for images, but that’s been done as well (and it works, I tried, stupid me).

Something I haven’t been able to make work is using empty links to show other images in the slideshow without having to show visible links but I haven’t been able to.

Dustin: The comments already mention the obvious way to do part of what you want. Just check the hover section of the CSS, as the arrows are affected by it.

eduo Apr 20th, 2006

Ah. And now I see the multiple link thing works. Fantastic.

Justin Apr 20th, 2006

I posted before as #304, and I still haven’t quite figured it out. My problem has to do with the Loading and Close GIF images. I did follow the advice given by #288, but it has not worked. It seems to me that the close button GIF is located too far up?

Any help is appreciated. You can see it running on my site at http://www.designdraft.net/?page_id=31 . Thanks a lot.

Massimiliano Marcon Apr 21st, 2006

There is a bug with konqueror…background become black.

Kev Charlton Apr 21st, 2006

I’m having a problem displaying gifs in the gallery. In IE when the gif loops it refreshes the caption animation at the bottom, and often crashes. Is there a way round this or can i just use static imagery?

http://resource.mediabuzzmail.co.uk/themediabuzz_new/portfolio.html

(check the one with the gorilla on)

Kristine Apr 21st, 2006

@ #367
You wrote:
> Can I show multiple images in 2.0 by using only 1
> image or do I need to show all the images on the page as
> thumbnails.

Yes, it is possible. You only have to show the first thumbnail. Like this:

But I don’t know, if there are errors in some browsers with the empty links! I only tried quick an dirty. ;-)

Kristine Apr 21st, 2006

Oops,

no code.

I try another way:

@#367:
You have write:
Link to pic1 – thumb1 – end link
link to pic2 – end link
link to pic3 – end link

So will only see thumb1, but the gallery will show all pictures.

andre Apr 21st, 2006

Runtime error seen in windows 2000 (not seen on other windows xp computers). V2.02

1) Line 87 error ‘Element’ is undefined.
2) Line 129 Object required.

If I run Debug, it points me to lightbox.js. I don’t see this on the client side when testing the webpage, nor on multiple PCs running winXP. Any ideas?

Chris R. Apr 21st, 2006

I can’t get the opacity of the background to change, is it necessary to change other values next to the three opacity rules in the #overlay declaration in the CSS?

Chris R. Apr 21st, 2006

Found it :)
On line 320 in lightbox.js you can change the values, CSS doesn’t matter in this case i guess :p

Magnus Apr 21st, 2006

thanks lokesh, wonderful script. will be using it on a new site i’m working on, http://www.re-treat.org and will make a donation when i have some spare cash

Tom Apr 22nd, 2006

Hi!

Could someone help me with my problem?

My wesite is http://www.bionicbabies.net and you can find the site where i used lightbox here: http://www.bionicbabies.net/index.php?%20site=fotos20041016 .

I just used it for the first picture for the time. The problem is: Lightbox pops up, but underneath my site. First the overlay graphic, then the picture.

I spent the last 2 hours coming that far, but i simply don’t know what to do next.

I’d appreciate your help very much. Once it works i’ll compliment on the it :)

df Apr 22nd, 2006

dfg

Jessica Apr 22nd, 2006

hello, lightbox is great! i’m trying to get the images fixed to the top of the page, with no margin-top. can someone help me telling me how to do this.

Vinoo Samuel Apr 22nd, 2006

Lightbox rocks. Just installed it on my website showcasing my one month road trip to the Himalayas, and you can’t imagine what a brilliant difference it has made to the site’s look and feel. Thanks Lokesh. I have credited you on the home page too.

http://blog.vinoosamuel.com/himalayas/

paul Apr 22nd, 2006

this is perfect for band photo galleries. in fact, i just implemented on my new band site, thanks!

Brent Vermilyea Apr 23rd, 2006

The lightbox script is awesome! Thank you very much! When I setup my own online gallery I’ll be making some donations. Feel free to check out my photoblog that uses your script at http://adistortedperspective.blogspot.com/

Cheers!

Richard Apr 23rd, 2006

I also need the ability to display other data besides images. Lightbox Gone Wild is overkill for me but Leightbox is simple and fills the bill nicely and is very small. I now use both LB js and Leightbox.

http://blog.eight.nl/articles/2006/02/21/fire-lightbox

They coexist fine if you:
Change script name from lightbox.js to leightbox.js (or whatever).
Eliminate conlict: change occurences of class lightbox in css and your html to leightbox.

Leightbox is really small and uses the same prototype so maybe using inline div’s will be added to Lightbox js in the future to simplify things for us.

See example at http://www.oldguy.us/tpo click the “Read about” link in 2nd paragraph. Further down the page I have some Lightbox js thumbnails.

Hey…while you’re there take a look at the Driver Awareness flyer. Click on the link “1. the “straight” version ” or just go to http://www.oldguy.us/tpo/lfus-flyer1.html

Kieran Apr 23rd, 2006

Hey guys!

So far i’ve modified lightbox to run on demand, and i’ve also got it working correctly when my divs are reloaded within the page – except the image doesn’t show up!

check this out – http://www.picturegrid.net/index.php

you can see it must be loading the image because it resizes…. but then it doesn’t show it!

Travis Schmeisser Apr 23rd, 2006

Is there a way to completely fade the background to black?

I tried changing the #overlay styles to:

filter:alpha(opacity=100);
-moz-opacity: 1;
opacity: 1;

Am I missing something?

John Fielden Apr 23rd, 2006

#383 Tom

Your lightbox.css is jacked up. You’re missing the majority of the file. Download it again and install over yours.

Tom Apr 24th, 2006

Thanks John, will try it and post if it worked.

SoulCreeper Apr 24th, 2006

i just implemented that lightbox objects to a webpage, but it doesnt seem to work properly. in fact, it’s not working at all :S
can someone please take a look at it, because it’s really driving me mad just because i cant find the problem. \
i guess it’s just the most simple problem ever, but i’m just overlooking it. i dont know …
here’s the webpage:
http://www.goudenkust.nl/nl/mj_inh_algemeen.htm

Danne Apr 24th, 2006

I got the file to show a flash file (.swf file) but i need to get the name of the file dynamic… grr…

Erik Apr 24th, 2006

Is there something inherent about tiff’s that would prevent them from working properly with Lightbox? I’m investigating using this as a means to display tiffs for a lab notebook webapp I want to put together. When I tried doing this with XP and IE6 it just continually spins the progress indicator.

Andrew Apr 24th, 2006

This is great been using the old version for (well since it was released basically), anyway needed to put up some photos for a wedding and lightbox seems like the best idea for that. However some of the photos are quite large (2560 wide etc..) and Id like to offer bigger photos to viewers who have the bandwidth. Anyway there is an issue if the image is larger that the current browser view port that the overlay doesn’t resize as noted by Mark L and Rom S somwhere above… This is the code I used to resolve this issue. Note that the resizeOverlay function should be called as part of the afterFinish literal in showImage.

resizeOverlay: function() {
// Make sure the overlay actually covers all the page dimenions
var arrayPageSize = getPageSize();
var wCur = Element.getWidth(‘outerImageContainer’);
Element.setHeight(‘overlay’, arrayPageSize[1] + (arrayPageSize[3] / 15));
Element.setWidth(‘overlay’, (arrayPageSize[0] > wCur ? arrayPageSize[0] : wCur));
},

smac Apr 24th, 2006

Great script! I love it.
I did have a conflict however. I’m also using the xfade image crossfader script by Kevin Smith (http://slayeroffice.com/code/imageCrossFade/xfade2.html).
It turns out, both scripts make use of an “imageContainer” div. It took me a while to figure out why nothing was showing up right!
A (picky) suggestion would be not to use “generic” names like “imageContainer” that could easily crop up elsewhere and cause conflicts. It would be just as easy to use e.g., “lbimageContainer” and reduce the chance of conflicts.

You can see both scripts in action at:
http://www.placewiki.com
(although the lightbox is only used on “place” pages that have more than one picture, like this one: http://www.placewiki.com/viewplace_detail.php?placeID=47

Thanks!
Steve

Nick (Australia) Apr 24th, 2006

subjet: Lightbox working before entire page loads

Hello,

Has anyone had any success with adding something that will alow the lightbox to work without the page having fully loaded. Lightbox is such a great feature it seems a waste to not have it working from first click if the page hasn’t fully loaded.

I know Lokesh is keeping it as an unobtrusive feature as an onload function but on my site I want obtrusive – I don’t want this thing not to work if I have eager mouse clicker trigger finger site visitors who don’t want to wait for all thumbs etc to download before they can see the great lightbox gallery. They just see the link on a new page in the same window – which makes it look worse than plain html galleries.

I think this is an important issure.

I have tried following advice from entry “#161 from anthonyjhicks” but have just not had any luck with that.

Please help.

Thank you kindly.

Lokesh Apr 25th, 2006

#370 Dustin – If you want to keep the ‘next’ and ‘previous’ buttons visible, comment out these lines as follows in the lightbox.js file:
// Element.hide(‘hoverNav’);
// Element.hide(‘prevLink’);
// Element.hide(‘nextLink’);

Also, update the lightbox.css so the ‘prev’ and ‘next’ images are visible always and not only on hover. Let me know if you need specifics here.

#385 Jessica – If you want to get rid of the top margin, open up lightbox.js in a text editor. Change: Element.setTop(‘lightbox’, lightboxTop); to Element.setTop(‘lightbox’, 0);

#391 Travis – If you want to adjust the opacity of the overlay open the lightbox.js file and tinker around with this line:
new Effect.Appear(‘overlay’, { duration: 0.2, from: 0.0, to: 0.8 });

#398 smac – Good point. With a wide-open namespace, generic id names like “imageContainer” are a bad idea. I should probably prepend them with a consistent prefix.

I will be addressing more comments as I get time this week, so just hang tight. As for feature requests, I have no plans to extend the script much further at the moment. Its a time thing. I will probably release a minor update with some tweaks soon. But do feel free to open up the code and add/edit/hack it up yourself. Thanks everyone.

macx Apr 25th, 2006

It should be possible to localize the text “Image x of x”" via config-commands.
Also you should add the keys “arrow right” and “arrow left” to navigate. Following works on PC and Mac: if((key == ‘p’) || (key == ‘%’)) and if((key == ‘n’) || (key == “\’”)).
Could you please add the stuff?

Triall Apr 25th, 2006

?????? ???? ???????

Andy Stones Apr 25th, 2006

Legend

ShadowKris Apr 25th, 2006

I love Lightbox 2.0 !!!

That’s a very nice work !!!

Congratulations :)

SoulCreeper Apr 26th, 2006

okay, here’s another request from me in addition to an earlier request i posted this week somewhere above.

is there a way that the close button (“X”) can be put in the bottom right corner of the picture that’s linked to? so that it doesnt slide out from under the picture but onto the picture’s bottom right corner.
In fact i want to have the close button in the same way put onto the picture as it was in the previous version of Lightbox.

i tried looking into the JS file, but because i’m not such a JS expert on that area i’m just requesting the issue here.

help would be greatly appreciated :D

sander Apr 26th, 2006

have not implemented it (yet), but it looks like a true gem, well done!

Hensel Apr 26th, 2006

Hi, i have a problem.
I´ve benn installing the script lightbox on a site. but the style is wrong its look like quirly !

Please take a look and tell me was is wrong !

thx

Hensel Apr 26th, 2006

Here is a link to a picture that show you the problem

Hensel Apr 26th, 2006

Pic

Soyuzno Apr 26th, 2006

I’ve try this, and works perfect. Well done :)

Is it posible if visitors want to print the image? I mean is it posible to add a print button or something?

Anyway, once again..well done!

Ståle Raknes Apr 26th, 2006

Very nice work !!!

Here is a tip to everyone :)

Fix Lightbox JS for Opera.

Add this to your css file:
@media all and (min-width:0px){
#overlay{
background: url(../images/overlay.png);
}
}

Then create a 1px png with 60% opacity on a black layer, save it in the image folder as overlay.png

Happy coding :)

Ståle

nick Apr 26th, 2006

does anyone know, why lightbox doesn’t work on my site?

http://flickr4j.nborn.ch

the small pictures in the upper left should be displayed with lightbox…

Gibbo McCool Apr 26th, 2006

Well done with version 2 !

For those attempting to use an imagemap ( image map ) with related images make sure you find the Both lines of
var anchors = document.getElementsByTagName(‘a’);
and change the ‘a’ to ‘area’ ( as mentioned on the original lightbox blog #140 ). Their on lines 172 and 326

thanks for the script Lokesh :)

Kaz Apr 26th, 2006

Lightbox iFrame Fix..
No!! lightbox.js adjustments needed ;-)

[1] In your iFrame page add the following
Display LightBox

[2] Adjust the values in the form to represent your url and title..

[3] In your parent page which contains the iFrame add the following along with the standard Lightbox calls..

function lBiFrame(obj) { //Create the function for your onclick event in your link…
var iframe = window.frames['pmf']; //this has to be the name of your iframe.
var iframeForm = iframe.document.lBiFrame_form; //this has to be the name of your frame and your form.
var hrefvalue = iframeForm.LightBox_iFrame_imgUrl.value; //this has to be the name of your “Image URL” hidden field.
var titlevalue = iframeForm.LightBox_iFrame_imgTitle.value; //this has to be the name of your “Image Title” hidden field.
var simulated_iFrameLink = document.createElement(‘a’); //Creates a href object
simulated_iFrameLink.setAttribute(‘href’, hrefvalue); //Sets the href object to your lightbox image.
simulated_iFrameLink.setAttribute(‘title’, titlevalue); //Sets the title object to your lightbox image.
simulated_iFrameLink.setAttribute(‘rel’, ‘lightbox’); //Sets rel href object to your lightbox image.
//alert (‘href: ‘ + hrefvalue + “, Title: ” + titlevalue); //For debug, to test if href and title are passed correctly..
myLightbox.start(simulated_iFrameLink); //Starts lightBox
}

[4] Make sure your sub frame had the correct name elements, mines called ‘pmf’ (name should do, but i set name, id and title just for backup) and change the source..

[[[ 5 ]]] If all fails, here’s the full demo code..

——– Save below as ‘index.html’ ——–

function lBiFrame(obj) { //Create the function for your onclick event in your link…
var iframe = window.frames['pmf']; //this has to be the name of your iframe.
var iframeForm = iframe.document.lBiFrame_form; //this has to be the name of your frame and your form.
var hrefvalue = iframeForm.LightBox_iFrame_imgUrl.value; //this has to be the name of your “Image URL” hidden field.
var titlevalue = iframeForm.LightBox_iFrame_imgTitle.value; //this has to be the name of your “Image Title” hidden field.
var simulated_iFrameLink = document.createElement(‘a’); //Creates a href object
simulated_iFrameLink.setAttribute(‘href’, hrefvalue); //Sets the href object to your lightbox image.
simulated_iFrameLink.setAttribute(‘title’, titlevalue); //Sets the title object to your lightbox image.
simulated_iFrameLink.setAttribute(‘rel’, ‘lightbox’); //Sets rel href object to your lightbox image.
//alert (‘href: ‘ + hrefvalue + “, Title: ” + titlevalue); //For debug, to test if href and title are passed correctly..
myLightbox.start(simulated_iFrameLink); //Starts lightBox
}

——– Save below as ‘LB_iframe.html’ ——–
Display LightBox

————————————————–
Credits to Sean K for his example that i adjusted (http://www.lokeshdhakar.com/2006/03/29/lightbox-v20/#comment-2235)

Nb. sorry for long posy ;-)

Nick Toye Apr 26th, 2006

Ok, has anyone had any success moving the prev and next buttons to the bottom area or image data container.

Alternatively, how do I add the text – “Press N to move forward and P to move back?

Kaz Apr 26th, 2006

Lightbox iFrame Fix..

Hmm.. Some of the code didn’t render well in the post, so zipped the whole working demo and posted it at the link below, hope this helps..

http://www.kharsim.com/LightBox2_iFrameFix.zip

Kaz

Nick Toye Apr 26th, 2006

My god, this should be in a forum, I don’t know who’s answering who.

noname Apr 26th, 2006

Nice script you have done her! But i wondering about can`t i make a folder and put all my picture in there and make a glideshow from this folder. And not to make a link to them all?

John Fielden Apr 26th, 2006

#415 Nick Toye
For your first questions, take a look at post #400 by Lokesh himself. If that’s not what you’re looking for, try posts #242, #305 and #314.

To add N and P key functionality, refer to posts #290, #323, and #401.

Jason Tate Apr 26th, 2006

Whomever figures out how to display .mov and .swf files, please post.

Thanks!

Malcolm Apr 26th, 2006

I am trying to fix the same bug as #397 Andrew proposed a fix for, but I’m not having any luck. I pasted in his javascript as I thought, but it doesn’t seem to be working…. the shadow overlay still has rendering problems if the image is bigger then the window.

My test is here if anyone wants to take a look: http://www.maljones.com/illo-treeoflife.html

Has anyone clearly fixed this bug?

Nik Apr 26th, 2006

I’m having a scope problem with Lightbox. When I implement the solution in just a static page, it works fine. When I try to implement in my AJAX application, it doesnt. Basically what I do is I have a PHP which returns information on a client, based on a variable which is passed in through Ajax. The information is then bound to a DIV using the innerHTML. So anyway..in that HTML, there is a reference to an image that I’m trying to wrap the lightbox anchor around.

Think of it like this:

// where the lightbox stuff is defined

So inside the container is where I have the block, and it’s having issues with the scope I believe. Anyone have ideas?

Nik Apr 26th, 2006

Ah, I’m sorry..parses out HTML I guess. What I meant to say is inside of the index.html, all of scripts and styles are defined at the top of the page, and there is a div container which is being filled with the data.

KD Apr 27th, 2006

Having an obvious problem in my page, the lightbox does not overlay on the Flash banner ad i have on the page. Also when I tried to shift the lightbox a few pixels down (top: 60px) it does’nt work. Can some1 help me out.

nick Apr 27th, 2006

is there nobody that can help me?

again my previous comment:

does anyone know, why lightbox doesn’t work on my site?

http://flickr4j.nborn.ch

the small pictures in the upper left should be displayed with lightbox…

Chris Apr 27th, 2006

Can lightbox be used to display html page? becasue I would love for it to act as somewhat as a pop up displaying a html page. or does it only display images?

arden Apr 27th, 2006

I’m relatively new to this so please bear with me if this seems like a basic question. I’m having trouble with the pictures opening on a new page (as noted on your web site it is a common javascript conflict). The part I’m having trouble with is finding the line ( aka the needed to patch. I don’t know where it is and haven’t been able to stumble upon it in the java scripts supplied. Could someone please direct me? This picture gallery looks like a great little piece of coding and I would love to encorporate it in the web sites I am involved with. Thanks in advance.

Bozoman Apr 27th, 2006

Cool thats awesome! Do you know how to add it to my Zoomshare site. (www.bozoman.zoomshare.com)

Very Excited Apr 27th, 2006

This is awesome!!

Mahesh Apr 27th, 2006

I have created a compressed/optimized version of the JS files. In total I’ve compressed the total size of the four .js files to 47 KB (about 50% smaller). Partly I’ve pruned all unused code from effects.js & prototype.js and then used an optimizer to remove whitespace & newlines.

I also created a Picasa Export template to create photo galleries quickly from Picasa. I borrowed the look and feel of your lightbox2 project page for it. I also added a little feature, where while the thumbnails are downloading, it shows a overlay with “Loading” message. Because while the thumbnails are still downloading, the onload function has not been called yet, so Lightbox is not yet initialized. If the user clicks on any thumbnail, it will simply show them the regular image. The overlay covers the whole page and prevents any clicks. The overlay disappears once all thumbnails have finished loading and since partially opaque, the user can see the thumbnails getting downloaded.

The Picasa template is available for download at : http://www.mahesh.net/lightbox/lightbox2_picasa_template.zip

This zip also contains the optimized js files. I haven’t created a separate zip for it.

Simon J Apr 27th, 2006

ONLOAD WORKAROUND

Has anyone found a working workaround to the unobtrusive onload function so that lightbox still works even while the page has not fully loaded?

I tried implementing changes from #161 by anthonyjhicks but I think he was referring to lightbox 1 when he was commenting out addloadEvent in lightbox.js as I can’t find that reference there.

This is something that help all lightbox users.

Thanks in advance.

Mahesh Apr 27th, 2006

Simon,

I have a solution. I would not call it a workaround and its very simple to implement. Look at the Picasa Template package in #430 above.

In header.html
There is a and some CSS for it in css\screen.css. There is a onload function to remove the overlay once the page has finished loading.

In footer.html
Just before you close the tag, there is a JavaScript block. It expands the overlay div all the way to the end of the page. This is when the page height is longer than the window height. Without this anyone can scroll the page, while other images are downloading and click away.

York Apr 27th, 2006

Lokesh, thanks for making Lightbox available; it’s a beautiful app. I’ve just made use of it at http://www.yorkrules.com/journal.

I’d like use it to sell my photos by adding an image-specific “add to cart” button to the “imageData” area, using WebAssist.com’s PayPal eCommerce Toolkit extension for Dreamweaver 8. The HTML behind the “add to cart” button is actually a form, with a number of hidden inputs.

Is it possible to add such an extension/form to the “imageData” area? If so, how?

Thanks again,

York

Anton Apr 27th, 2006

I’m using Lightbox without any problems and just have stumbled on an interesting error.
When adding the new Sidebar Widget into wordpress and using some of its features Lightbox still works but not the way as intended. The picture just show on a new page in the browser. It happens in any browser and only when the sidebar widget is actually used.
Maybe someone knows a solution to it
thanks

Richard Apr 28th, 2006

re: #415 Nick

“Ok, has anyone had any success moving the prev and next buttons to the bottom area or image data container.”

Tried but failed.

“Alternatively, how do I add the text – “Press N to move forward and P to move back?”

Did it and hated it. (it’s an ugly, unfriendly solution). I finally got the NEXT/PREV buttons moved all the way to the top and always displayed. It makes a nice clean layout. Suggest you browse to this page on my site:

http://www.oldguy.us/easy-riding/05-tl/

Click on the “Slide Show” link under the top photo to view the results. If you like it then just grab lightbox.js and styleLightbox.css from your Firefox cache or IE’s temporary internet files folder.

Richard Apr 28th, 2006

##426 Chris

“Can lightbox be used to display html page?”

No. Suggest you try Lightbox Gone Wild. It will do what you want.

http://particletree.com/features/lightbox-gone-wild/

Vini Apr 28th, 2006

Can anyone shed any light on my problem, i click on a thumb, and the LB pops up, just ti doesnt do anything…

http://www.vini.co.uk/gallery/index.php?level=album&id=83 is an example page.

Simon J Apr 28th, 2006

re#431 and 432

Thank you kindly Mahesh. That is definitely an option. I’ve tested it and it works well across different browsers.

I am hoping for an alternative to the onload rather than an overlay if possible. I will certainly use your method if I dont come across a working onload alternative.

Might as well re add my request: Has anyone found a working workaround to the unobtrusive onload function so that lightbox still works even while the page has not fully loaded?

Thanks for that.

Harmunt Apr 28th, 2006

Excellent product!

I use this facility with great success on my blog to display JPEG images and I was extremely pleased to discover it’s merits in displaying animated GIFs.

However once I try SWF Flash files the lightbox activates but displays nothing… Is it actually compatible/designed to display flash files or am I expecting too much from the software? :)

anouke Apr 28th, 2006

I’m using this script for a small gallery linked from my blog but it doesn’t work correctly. It only shows three of the nineteen photographs and I don’t know why and everything (archives and scripts) is in the right place :(

Please take a look here:
http://anouke.spymac.com/fotografies_lightbox/index001.html

All the comments and responses will be really appreciated. Thank you very much! :)

pkruegel Apr 28th, 2006

Awesome Tool.

Though stumbled across a small problem. I am sending my blog entries to an iframe and therefor lightbox wont expand beyond the size of that iframe. Is there any kind of advice how to fix that? Adding _top to the picture links won’t do it i suppose, couldnt get it to work to be honest there.

Any help would be greatly appreciated.

thanks a lot and regards.

Mahesh Apr 28th, 2006

Re: #438

Simon,

One possible solution is to disable the last line in lightbox.js
Event.observe(window,’load’,initLightbox,false);

and in your HTML, stick this just before the end of the <body> tag within script tags

initLightbox()

It seems to work but I couldn’t really try it, since I am sitting on a very fast connection and thumbnails load quickly. I’ve implemented this here
http://mahesh.net/lightbox/sample_gallery3

Try it and let me know if it works.

1madff Apr 28th, 2006

Great tool, for the lay people, do you have any way of making it generate the html, so we can just copy and paste it to a webpage, because I am way lost, I tried to do it myself…..sadly i failed!!

1madff Apr 28th, 2006

Never mind I just figured out what I did wrong!!

Tim Apr 28th, 2006

Awesome resource. Rock on!

arian Apr 29th, 2006

awesome, using it for travel galleries:

http://www.ar1an.com/china/gallery/

arun Apr 29th, 2006

Awesome script!

I tried it (both versions) on Opera 7.54 – the first time it works great. but if we click on the same thumbnail again, I can see only the loading graphic..the pic doesnt appear. Can someone tell me, please, if there is a fix for this.
Also , Lightbox v1 works on IE5.5 but v2 fails (ie., images open in another window)
Kindly help. Thanks.

Vinoo Samuel Apr 29th, 2006

Just finished a website of my one month road trip to the Himalayas using Lightbox, and it rocks.

Check it out at http://blog.vinoosamuel.com/himalayas/ and let me know your comments…

Vini Apr 29th, 2006

#440 anouke

im having the same problem.

http://www.vini.co.uk/gallery/index.php?level=album&id=86

Pierce Apr 29th, 2006

I’m interested in using Lightbox JS for the photblog that I have yet to create. I want to use Lightbox JS to display my daily images (as well as utilize its navigation system to browse through past pictures), as opposed to having multiple thumbnails and forcing a user to click on one to have it enlarged and only THEN being able to use the LB navigation to browse through the pictures. So basically, I want a typical photoblog setup, integrated with the smooth transitions of LB. I hope I’ve explained this clear enough for most to understand; I’d like to know if this is possible? If so, are there any existing examples on the internet? Thanks in advance.

badstyle Apr 29th, 2006

none of this is working for me, I’m pulling in the content of a gallery page from an . However the page that the include sits in is top level of site.

I’ve made sure all the relivant folders that are need for lightbox sit on the same top level as the page that contains the include, and there are no onLoad’s in the . The head contains all relivant links to .js and .css files. Still nothing is working at all.

Upon clicking the thumbnail – the desired image opens, but only as a direct link to the image and not via the lightbox feature. Bizzare.

Any other pointers I should check out? Sorry no links, working on testing server.

Bob S. Apr 29th, 2006

i’m not sure what i’m doing wrong, but Lightbox doesnt seem to be working properly, needless to say, i’m not very good with computers, but i’m pretty sure i did the html part right.

can anyone give me detailed instructions on how i install Lightbox 2.0 ?

T.J. Apr 30th, 2006

I REALLY love Lightbox 2.0. It is almost everything I am looking for. It is great to include captions. I was wondering if one thing is possible though…

I would like to have a title for each of my photos in addition to a caption. I was wondering if this is possible. Here’s what I’m thinking – the title attribute in the link reference is the caption – maybe the alt attribute in the image source could be the title? So if my title=”blah, blah, blah” and my alt=”The Blah Picture” it could look like:

[Picture Here]
The Blah Picture
blah, blah, blah X Close

If I could code I’d do it myself, but alas I’m a moron when it comes to that.

Also, for windows users, it it possible to get rid of the image options that appear over images in IE?

Simon J Apr 30th, 2006

Re: #442

Hi Mahresh,

Thanks for that. Sensational. Thats what I’m after.

Works in IE6, Opera 8 and Firefox 1.5.

Doesn’t work in Netscape 6 (it operates as per normal if the page has not fully loaded) – but hey – who uses that anyway?

I tried it with a very slow loading gif on a test page and it works a treat.
http://theinstamatics.com/bandmembers/n16.htm

Thank you kindly Mahresh – you are the absolute greatest!!

Simon J Apr 30th, 2006

OPERA FIX

Hello, the transparency overlay is not working for me in Opera 8. I have tried the tip presented in #411 but have not got anywhere with that.

Has anyone got a fix for transparency of the overlay in Opera?

Thanking you.

stifler Apr 30th, 2006

THIS IS AWESOME!

Syed V Apr 30th, 2006

Man… you are amazing!
I’ve been trying to find a good way to display images on my website and since I’m new to this, I spent a long time searching for a perfect script and I swear I found it!

Thank you!!!

Bob S Apr 30th, 2006

do i need to upload any files for Lightbox 2 to work?

badstyle Apr 30th, 2006

ok right this is great yeah, if only it would work.

I’ve worked in commercial web design for about 5 years now, primaraly as a designer and on the side line as a low level developer, yet I can’t get this to work on my testing server at all.

It makes no sense, as the source files I’ve downloaded with the sample works fine, and no matter how many times I replicate it and the folder heirachy on my testing server it just doesn’t work, is this a known bug for this IIS or something? Anybody else out there who can’t actually get it to function at all?

Vini Apr 30th, 2006

Bob, yes you do, you need to upload Lightbox.

David Apr 30th, 2006

I can’t seem to get the loading gif to show or the close logo to show when you view the pic. It just shows a x like it can’t find the image and I dont’ even get the x to show in firefox. I don’t see where on the css file where I need to change the location of the files so it points to the right location. Any ideas of where I’m looking wrong??

Nick May 1st, 2006

re#461

David, the loading gif is changed in lightbox.js. Try that

Daniel May 1st, 2006

I got it working when it was loading pictures that were hosted in GeoCities. But since I have most of my photos hosted in Flickr, it didn’t load them properly.

Is there something that I need to do in order for this to work with photos hosted in Flickr?

Thanks.

Ray May 1st, 2006

Wow, amazing script. Works great, just what I was looking for !

It works really well within my ASP script, which shows the images out of the database.

Thanks alot !!!

Nick Toye May 1st, 2006

#419 John Fielden

Cheers mate, I must have missed it, :)

Alejandro García May 1st, 2006

Awesome!

Congratulations… from México!

Thank you.

McShark May 1st, 2006

Hi!

First I want to give thanks and greetings from Germany!
I’ve one questions on your nice code for my website:

There are new versions of the js you are using. Updating them could be maybe useful, or not?

McShark May 1st, 2006

I found a mistake! (Results in a lot of 404 errors)

You forgot to comment lines 34-41 in scriptaculous.js.
PLEASE DO THAT!

Thanks!

Angelo May 1st, 2006

Thanks for making a great script. I sent in some cash for your efforts.
I implemented your script here:

http://angeloandnicole.com/gallery_out.php

Li-An May 2nd, 2006

OK, I found some possilbe answers to my question (2 javascripts in conflict) see #346
http://blog.metawrap.com/blog/CommentView,guid,42b961d5-b539-4d9a-b1e0-108e546ae3e6.aspx
It seems that prototype.js is used to create conflicts. I would be happy if someone can give me an eventual solution :-)

Carlito May 2nd, 2006

Hello,
First I would like to say that I really like you work, this script is nicely done.

I would like to know how to reduce the space between the top of the navigator’s page and the lightbox, I have nearly 40 pixels and I would like to make it 20. I searched in the css and js files but I can’t find where I can modify this setting. Thanks if you can help.
Carl

Richard May 2nd, 2006

re #471 Carlito

#lightbox{
position: absolute;
top: 40px;

Li An May 2nd, 2006

ref #470
It’s OK, I’ve found a solution. It was prototype.js the origin of my problem and I changed my second javascript code to work with it.

Carlito May 2nd, 2006

ref 472
Thanks Richard but I tried that before posting, it was obvious but as it didn’t change anything (I use firefox and ie) so I came here to ask.
Any other idea ?
Carl

Scrambler May 2nd, 2006

In my Web I make serve ajax, the library prototype following this example: http://www.ajaxlessons.com/2006/02/18/ajax-workshop-2-building-tabbed-content/

When I try to insert in a tab, for example second. LightBox 2,0 does not activate and it shows the image to me without the LightBox, if somebody knows like being able to connect so example the superior example with lightbox serious to explain me, Pleas Help Me :’(

Thanks For Your Time

Masa May 2nd, 2006

Hi,
thanks for Lokesh to provide this wonderful tool.

I just modified Lightbox JS v2.02 to enable it to use image files without rel tag.
You can download it from here,
http://slightlyblue.com/blog/2006/05/rellightbox_js_v202.html
directly from here.
http://slightlyblue.com/dl/Lightbox/lightbox.js

Single Picture(*.jpg/gif/png/bmp) : able to use LB without rel tag
Grouped Pictures : use rel=”lightbox[whatever]” as same as the default version.
maybe a solution for those flash users(unconfirmed)

If you don’t like it, it will soon be removed, so tell me if so, Lokesh.

Nick (Australia) May 2nd, 2006

Re #455 and #411

OPERA 8 Transparency works with this setting in lightbox.css file

#overlay{
position: absolute;
top: 0;
left: 0;
z-index: 90;
width: 100%;
height: 100%;
background-color: #000;
filter:alpha(opacity=60);
-moz-opacity: 0.6;
opacity: 0.6;
}

/* opera fix ———————————————– */
@media all and (min-width:0px){
#overlay{
background-image: url(address to.. overlay.png);
back\ground-color: transparent;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src=”address to… overlay.png”, sizingMethod=”scale”);
}
}

Hope that helps.

Nick (Australia) May 2nd, 2006

re #477

OPERA 8 Transparency

ps filter: progid: etc meant to be on the same line in css file..

Dixel May 2nd, 2006

I have the same problem that #475 somebody has some idea?

Masa May 3rd, 2006

well, I have time..

re#475, 479
http://slightlyblue.com/blog/2006/05/ajax_lightbox_js_v202_1.html

call: myLightbox.initialize()
after you get the AJAX.Request onComplete.

Christophe May 3rd, 2006

What a great piece of web! ;-)
I ran thru all the comments here, but somehow couldn’t find anything about the topic I want to comment: I think it makes sense to have an animation of the lower “imageDataContainer”-element (holding caption etc.) whenever you click on a single image you want to focus. However, it can get a bit too much animation if you go thru a group of images with the next/previous links.

Did I just oversee a feature to turn it off?

mark May 3rd, 2006

so stoked..

made a little flickr search using lightbox 2.0

http://homemademess.com/tagr.php

thanks Lokesh!

scrambler May 3rd, 2006

Thanks Masa!!!

BAA May 3rd, 2006

thanx Lokesh.

now can we add FLASH content instead of an image ?
or the version is still not released ?

Branndon May 3rd, 2006

I would like to open a html page instead of an image. When I change the target to relfect that it doesn’t work. I downloaded a version of lightbox 1 where it was possible. Can someone tell me what I need to do to get lightbox able to open html pages rather than only images?

Branndon May 3rd, 2006

oh, i forgot, my sample site is
http://www.projecttorque.com/index.php?content=video thats the page i want to open a html in, if you click on the car, it opens in a new page

this page with the pictures works fine though
http://www.projecttorque.com/index.php?content=engine

Branndon May 3rd, 2006

have been working on it this morning… I got my videos to load through a different script. But now my images are not loading! again,

Now works:
http://www.projecttorque.com/index.php?content=video

Now does NOT work:
http://www.projecttorque.com/index.php?content=engine

Evgeny May 3rd, 2006

Why is there no close button while the image is loading?

If the image is taking ages to load – I would like my users to be able to go back to the page, and when a user is pressing the “Back” button to do it – its a great disappoitment.

to be short:

I want to write “Please wait while loading large image…”
and to have a close button to ‘undo’ this action of loading.

Am I asking for too much?

Great script though, really like it! :)

Jayson May 3rd, 2006

Hello Lokesh!

I have an odd problem! Your wonderfull lightbox script works on my local client (tested on mac and win) but when I upload it to the web the lightbox wont work… How can this be???

Jayson May 3rd, 2006

If you want to take a look at whats funky…

http://www.pixelstud.com/portfolio/icons.html

Joseph May 3rd, 2006

Hi!

I know that maybe this is a silly question, but since I have not been able to sort it out by myself I need to ask you all; I installed it in my website and I could not make it work, what it does is that the image opens up in a new page.

I already did what Lokesh says about append the initLightbox() in the onload attribute but still not working. I have tried it in firefox 1.5.0.3 and IE 6.

Could you tell me what is happening?

Thank you for your advice!

Mahesh May 3rd, 2006

Re: #489. 490

The .js files that you have uploaded are somehow messed up. When i load it up in Firefox, I see this error messages in the JavaScript console.

Error: missing ; before statement
Source File: http://www.pixelstud.com/portfolio/inc/prototype.js
Line: 1, Column: 149
Source Code:
type is freely distributable under the terms of an MIT-style license. * * For details, see the Prototype web site: http://prototype.conio.net/ */*————————————————————————–*/var Prototype = { Version: ‘1.4

When I view the file http://www.pixelstud.com/portfolio/inc/prototype.js , I don’t see the comment block. I am guessing the problem is with Line-endings, but could just be something totally bizarre. Try re-uploading them and make sure you upload them in ASCII mode if you are using FTP.

DJ Webb May 4th, 2006

I was impressed with the original Lightbox… The new one gives all the extra’s my users were begging me for.

Thanks a lot Lokesh. Great work.

Photography-of-rock.com

Thanks again

DJ

SilverRavage May 4th, 2006

Hey for some reason on mine it is only working for FireFox not IE, it loads the image in a blank page. It doesn’t work at all. The image opens up in a new page. What’s wrong? I saw that on the http://www.lokeshdhakar.com/projects/lightbox2/ site but tried it and it didnt work. Where it is located at is http://www.silverdimensions.net/LB/index.html

IF anyone could help out I would appreciate it.
Thanks alot
Silver

Will H May 4th, 2006

Hi, I was wondering if anyone can help. I have lightbox set up to where I have an image from a video, and the caption is a link going to the video, which is a flash SWF.

What I have been trying to do (and have been unsuccessful) is have the link to the video open up a new browser that is resized to the size of the movie. It links to the video fine, but it’s in the same browser/doesn’t resize. I tried adding a script for resizing the window inside of the caption such as…

onclick=”window.open(‘images/video.jpg’,'characters’,'height=300,width=400′);return false”

…but had no luck with it working, I tried to replace characters with HTML entites as well. Since I’m an amatuer with JS, maybe I am doing something wrong?

heres what I have working. if anyone can show me how to get this linking to a new browser that is the size of the video, I would greatly appreciate it.

Thanks, Will H

tee May 4th, 2006

First of all a great script you have.

I am implementing the script to a site, it works great except in IE 6 which the ‘prev’ and ‘next’ buttons are not showing up, but the prev/next funtions do work.

Further testing, tweaking with CSS lead me to a conclusion that the lightbox js is conflicting with the Dean Edwards IE7 PNG Alpha script that I use for a PNG logo, I am wondering if there is a way for them to co-exist.

This is the page that has IE7 script.
http://new.spotlightonthesquare.com/cuisine.html

and here the page without and you can clearly see the ‘prev’ and ‘next’ buttons do show up.

Thanks!

tee

tee May 4th, 2006

Oops. I for the another link

Further testing, tweaking with CSS lead me to a conclusion that the lightbox js is conflicting with the Dean Edwards IE7 PNG Alpha script that I use for a PNG logo, I am wondering if there is a way for them to co-exist.

This is the page that has IE7 script and the ‘prev’/ ‘next’ buttons are not showing up.
http://new.spotlightonthesquare.com/cuisine.html

and here the page without and you can clearly see the ‘prev’ and ‘next’ buttons do show up.

http://temp.spotlightonthesquare.com/cuisine.html

Thanks!

Mahesh May 4th, 2006

Re: #495

Will,

its actually not difficult to do what you want.

Step 1:
Add a Javascript block somewhere in <head> area
function openWin(url, width, height) {
aWindow = window.open(URL,’thewindow’,'width=’+width+’,height=’+height+’,location=no,resizable=yes,scrollbars=yes,screenX=20,screenY=20,top=20,left=20′);
}

Step 2: In the caption for the image
title=”&lt;a href=&quot;javascript:openWin(yoururl, 400, 400)&quot &gt;View Video&lt;/a&gt;

Check it in action here: http://www.mahesh.net/lightbox/sample_gallery . The very first image has a link that will open a new window

Fiestoforo May 4th, 2006

Oh Thanks for the code, it is really cool!

Will H May 4th, 2006

Great, got it working. Thanks a million, Mahesh!

-Will H

Will H May 4th, 2006

I actually have one more question… with the link being in the title, it shows the link when you rollover the image. Is there a way to have a caption show up in the title when rolling over the image instead of the link showing up?

Thanks,

-Will H

Deny May 4th, 2006

do you have any plan to make this wonderful script open html page like Thickbox did?
That will be very great.

Lightbox are kool :)

Neil May 5th, 2006

A VERY impressive script, well done. This is the kind of stuff that keeps the internet from stagnating! I’ll be looking to use it on some future designs that’s for sure.

SilverRavage May 5th, 2006

Re 494. Can anyone at all help me with this??

Thanks very much

AnalogPanda May 5th, 2006

Awsome, Lokesh. Thank you for sharing!

I do have a question. In FireFox (winxp), the blinking cursor shows up over the middle of the image. The cursor seems to stay in the last spot that a link was clicked. I’m surprised none of the 500 or so other commenters have brought this up – perhaps it’s an artifact of one of my ff extensions.

Has anyone else witnessed this? Might there be a JS fix to turn off FireFox’s blinking cursor?

Simon J May 5th, 2006

Flash problems in Mac Safari only

Hello,

I am having problems in Mac Safari with the Flash header showing through the Lightbox photo when moving the mouse (possibly over the links in the flash file – my client pointed it out).

It works perfectly in every other browser tested. The flash image has a zindex 0, lightbox has z index of 100, I have added wmode=transparent and done all the other things suggested to get the lightbox working over the top of flash content – and it does – just not for my client in mac safari.

the test page is here:
http://scoutphotographics.com.au/draft20.htm

screen cap from my client’s mac is here:
http://scoutphotographics.com.au/test04.htm

any ideas / suggestions?

thanks in advance

Mahesh May 5th, 2006

Re: #501

Its possible. But requires a small change to lightbox and changing the title attribute to ‘caption’. Check it out http://www.mahesh.net/lightbox/sample_gallery/

Step1:
change all the title attribute in the <A> Tags to ‘caption’

e.x: <A href=”image.jpg” rel=”lightbox” title=”Hello”>
to <A href=”image.jpg” rel=”lightbox” caption=”Hello”>

Step2:
In Lightbox.js on lines 331 and 339
change imageLink.getAttribute(‘title’)
to imageLink.getAttribute(‘caption’)

Before making any of these changes, just make a backup of your HTML & JS files, so that if things don’t work you have a chance to go back.

Anonymous May 5th, 2006

Just a note to say that I had a wee spot of bother with the NEXT and PREVIOUS buttons appearing, but managed to fix it by correcting the css to;
#prevLink:hover, #prevLink:visited:hover { background: url(./images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(./images/nextlabel.gif) right 15% no-repeat; }

instead of;
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }

Ryan May 5th, 2006

I cannot get Lightbox to work when using Prototype’s Periodicalupdater. I saw in a previous comment that I need to initLightbox() after changing the innerHTML of a div. I’ve tried doing everything I can think of but it still does not work. If anyone can help me out I’d really appreciate it.

Please email me:

r dot chamberlin [at] turn1media dot com

THANKS!!

tee May 5th, 2006

a follow up of my previous posts #496/497, that the ‘prev’ and ‘next’ buttons not showing up in IE 6.

Someone who writes JS for living gave me a pointer, that “the lightbox script is using window.onload which cannot co-exist nicely if there is other js in the same page”. He said a proper little handler can take care of this issue.

I know nothing about JS, and is hoping Lokesh or anyone can who knows can make a little upgrade version for the handler.

Much appreciated!

tee

tee May 5th, 2006

Hi never mind. I decided to try the MSIE alpha filter for my png logo and placed it in if ie conditional comment. It solves my problem now.

tee

Killer Possum May 5th, 2006

This script is AMAZING. And the fact that it’s free makes it even more amazing. So easy to use, and so elegant. Thank you so very much! I will be recommending this to everyone I know!

Anonomyus May 5th, 2006

The window for some reason fills my whole browser window. Could someone tell me how to prevent this???

ryan coyle May 5th, 2006

I am having trouble with the script opening the last picture in a chain first instead of starting at the beginning. any help?

reini May 5th, 2006

great work!
respekt!!!

http://www.weisseschatten.de

SilverRavage May 6th, 2006

Hey This script is really awsome, but no matter what I have done or looked into I still cant figure it out. Can someone email me with some help pleaseeeeeee. Thanks

ryan coyle May 6th, 2006

ok so I figured out that when I use the text link “image #1″ the script opens that image and goes through from beginnning to end, but I am trying to use graphics to open the script and it always starts at the end when I do (on-line It won’t find any images, first or last, when I link the script with an image). if anyone has run into this problem I would be stoked on help…to lokesh I would be willing to pay to get this working right I really like it, and really appretiate the time you spent to offer free scripting, it is just a lot of code to fish through to figure out these little quirks.
thanks

silverRavage May 6th, 2006

be more specific did you follow the steps in the “test page” html

are you using dreamweaver?
did you
“Include the Lightbox CSS file (or append your active stylesheet with the Lightbox styles)”

ryan coyle May 6th, 2006

comment 518 was from me guess I am tired, thought I was typing in a commet subject :)

LastOne May 6th, 2006

Hello!

I’m using Lightbox 2 in my wordpress blog. The Question: is it possible to fix the “prev” and “next” buttons and place them autside the picture when it pops up? So that it didnt disappear when you move the mouse-pointer away?

Ke1ner May 6th, 2006

If the image’s width is very big , how can I do ?
ex: DC foto over 2000 px . display this foto.

GrayShade May 6th, 2006

Nice work, but scrolling the page with an open image is slower than in the first version. (Firefox 1.5). Any ideas with this?

Andrew May 6th, 2006

Fristy what a brilliant script! :) Thank you !

Expect a donation soon :) -> i’m not joking :)

I have 3 questions -

1- what setting in the css do I change to make the box appear closer to the top of the screen?

2 – with the new update came the addition of the “close” image. How can I remove this image (as I prefer just the cross)

3 – I’ve noticed that if I have a vertically large image that is larger than the vertical resolution of the screen then the close link doesn’t appear and I can’t close the image. Can this be fixed? Or is it best to just keep images small?

Rodrigo May 6th, 2006

aloha….one cuestion….its posible call the ligthbox from a flash button???
How???

SilverRavage May 7th, 2006

ryan coyle, It works but i cant get it to work in IE I have tried the code that it says on the page to try but it didnt work and yes i am using Dreamweaver, and half coding it, what did you mean exactly by append

Thanks again

Li An May 7th, 2006

#520 Take a look at this http://www.palintest.com/products/multiphot/7500
view the source, get the css file and the ligtbox.js file and compare with yours. You may read all these comments to find how to get Next and Prev button be always visible.

Anonomuys May 7th, 2006

Re: #513
It’s OK Now.

pim May 7th, 2006

Hallo,

first of all thanks for the great lightbox solution.

Everything works perfectly

I am haveing problems in IE and FIrefox with a lightbox over a flash header. No, the Flash is not in front of the lightbox, my problems are borders (when the mouse is in the area where the flash file is in the background) around the flash header and the lightbox (the half lightbox, e.g. the next or the previous part of the image, is surrounded with a border similar to the border of the flash header).

The flash image has a zindex 0, lightbox has z index of 100, I have added wmode=transparent and done all the other things suggested to get the lightbox working over the top of flash content.

link: http://www.bistro-rosarium.de/new/?Karte
screen shot: http://www.bistro-rosarium.de/new/1.jpg

any suggestions?

thanks in advance
pim

eric May 7th, 2006

i have a bug on this with safari and images loading on top of a flash film….
anybody have a fix?

here is the site
http://www.palaquin.com/SelfCare.aspx

use this email.
test_at_mailinator.com

works fine in Firefox and IE pc….

help me please.

jasperguy May 7th, 2006

#526 Li An

Thank you, I finally got the next and prev to work under the captions.

http://eddiewong.ca/photograph_wedding.html

Thanks for the script! fantastic. If anyone see any bugs on my working site, please let me know, I need someone to help me test it with a MAC platform.

jasperguy at yahoo dot com

Thanks in advance.

Simon J May 7th, 2006

re 506 and 529

Flash problems in Mac Safari only

Hello,

Has anyone found a fix to overcome Mac Safari quirks with lightbox (and really all DHTML)?

I think we need a guru!!

>>original comment>>>
I am still having problems in Mac Safari with the Flash header showing through the Lightbox photo when moving the mouse (possibly over the links in the flash file – my client pointed it out) – may also have something to do with the mousover of the next and previous images)

It works perfectly in every other browser tested. The flash image has a zindex 0, lightbox has z index of 100, I have added wmode=transparent and done all the other things suggested to get the lightbox working over the top of flash content – and it does – just not for my client in mac safari (which is what he uses).

the test page is here:
http://scoutphotographics.com.au/draft20.htm

screen cap from my client’s mac is here:
http://scoutphotographics.com.au/test04.htm

any ideas / suggestions?

thanks in advance

tee May 7th, 2006

#531 Simon J

It’s Z-index issue. Although you’d declared in your flash object, but you need to declare Z-index in #headerA.

Note that Z-index only works when you declare Position: relative (or absolute), which you omitted in the #headerA

set higher Z-index for the div tag that holds your Lightbox images.

Hope this helps!

tee

tee May 7th, 2006

>Although you’d declared in your flash object, but you need to declare >Z-index in #headerA.

This line got cut off in my previous message.

param name=”wmode” value=”transparent”

Dan Steingart May 7th, 2006

This package rocks! I’m having trouble integrating it iinto a google maps mash-up though… it seems that an openInfoWindowHtml call in the google maps api creates a seperate page within the page…. when I try to call … from an info window it just opens the link in a new page…. when I call it from a link outside of the map it works. Anyone use this with google maps before and get it to work? Thanks in advance.

Gomi May 8th, 2006

This is awesome! I’m still picking up my jaw from the floor… thank you very much for unleashing such a beauty! :)

Simon J May 8th, 2006

re #532 and 533

Thank you Tee. Will try the position relative suggestion and advise the results.

(already add param name=”wmode” value=”transparent” and embed name=”wmode” value=”transparent”)

Cheers.

nick May 8th, 2006

why thumbs dont show up? http://e-salonica.com/test/index.php

jasperguy May 8th, 2006

#537 nick
It’s a php issue.

Simon May 8th, 2006

re #532, 533 (and 531)

Hi Tee,
Adding position relative makes no difference to the flash header showing through in MAC Safari. Thanks for the suggestion.

Simon J May 8th, 2006

re 531

RE Mac Safari Showing through Lightbox

Any suggestions:

the test page is here:
http://scoutphotographics.com.au/draft20.htm

screen cap (from my client’s) mac is here:
http://scoutphotographics.com.au/test04.htm

george w May 8th, 2006

re #540

PERHAPS HIDE THE FLASH DIV?

simon

one way to get it working might be to hide the flash content when someone clicks on the lightbox link. I tried it but couldn’t get it to work when the rel=lightbox was in the link.

Does anyone else know how to hide a div when someone clicks on a lightbox link and then show it again when lightbox is closed?

this could benefit all users having difficulty with mac display of flash content showing through the lightbox

eric RE SAFARI May 8th, 2006

RE SAFARI

Does the maker of lightbox have any fixes for this flash issue in safari?

thanks

Jon G May 9th, 2006

re #540, 541, 542

This is a quick hack.

Open lightbox.js

Look for
start: function(imageLink) {

and add
document.getElementById(‘header’).style.display = “none”;

(replace header with the name of the div)

And look for
end: function() {
and add
document.getElementById(‘header’).style.display = “block”;

(replace header with the name of the div)

Hope this helps.

Cheers.

Sreedharan May 9th, 2006

Wov.. It’s really amazing..

I used it in my site…

My site have the feature to change the number of images dynamycally by means of sliders…

While am clicking on the images your lightbox effect didnt work.. it loads the image in the browser in a old way… after i came back (by clicking on the brwser’s back button).. it works fine…

So, please help how could i fix this bug.. i dont know what mistake i did…

Sreedharan May 9th, 2006

I forgot to give you my site url in my last comment…

http://www.asokapapers.com/ajax/demo/index11.php

tee May 9th, 2006

#539 Simom,

It’s because you didn’t do it right.

See the page I came up:
http://lotusseedsdesign.com/lb/lb.html

I also made a screen shots for PC’ IE, Safari, Firefox and Opera for PC and Mac. Click the links on the left to see the results. For some strange reason the Opera on Mac, the flash stays on top of the lightbox’ image. It’s definitely z-index issue, but a bit unusual for Opera I must say. It maybe a bug for the later version of Opera Mac. You may want to google CSS bugs for Opera to find out why.

In Safari, the flash flickers a bit when large image slowly showing up, but I don’t think that would be a problem as far as performace concerned.

Here is what I did to your code:

1) remove the z-index from your tag in your html
2) #headerA {
position: relative; z-index: 50;

3) #nctR {
position: relative;
z-index: 100;
}

4) #nctThumbs {
position: relative;
z-index: 200;
}

I actually not sure #4 if needs z-index howerver when I removed it, the thumbnail stays on top of the large image, so I put it back.

Hope this helps!

p/s.I will look into the Opera Mac problem tomorrow when I get a chance. Really must go to bed now.

tee

Simon J May 9th, 2006

RE 543 (540, 541, 542)

Jon G you are an absolute genius.
thank you for your suggestion and coding – it works a treat on the PC – just waiting to hear back from my client on the MAC.

demo: http://scoutphotographics.com.au/draft25.htm
IE quirk:http://scoutphotographics.com.au/test05.htm

One perculiar thing happens in IE(6) on PC with this method –
when the page is first loaded, a box (as if its a link off the whole header) appears around the original header (without mouseover) with alt tag “Press SPACEBAR or ENTER to activate and use this control”

when you click the header the box appears and links can be accessed as normal.

do you know how to overcome this quirk so the header operates as normal first off with your div hide suggestion?

either that, or do you know how to target it towards MAC only?

thank you kindly for your help.

nick May 9th, 2006

#538 jasperguy

can you help me with that I dont know what I am doing wrong please I need your help

Jon G May 9th, 2006

Re #547

That seems to be related to this
http://www.amarasoftware.com/flash-problem.htm
Google: http://www.google.com/search?q=click+to+activate+and+use+this+control

Sreedharan May 9th, 2006

Plz anyone help me

#544 and #545

Simon J May 9th, 2006

Re #547

Thanks Jon G
All sorted now – much appreciated.

http://scoutphotographics.com.au/draft28.htm

God bless.

Simon J May 9th, 2006

#546 tee

sensational. Thanks for the help Tee.
will give it a run past my client on the Mac.
Thank you kindly

cl May 9th, 2006

two questions:

1) there a way to code lightbox so that image opens up onmouseover?

2) i’m using a javascript/css ticker that initially hides all images except the first one…lightbox is not working for the images hidden with my div tags once they appear…is there a way to make lightbox work even though images are hidden initially?

solutions?

Dave May 9th, 2006

Hey guys, not sure if anybody can help me out. I’m using a drop down menu and would like to use Lightbox, but it seems as if there is a conflict of scripts. I get these errors:

Error: l6963656E73654E756D626572 undefined is not defined
Source File: http://www.activetuning.com/scripts/mmenudom.js
Line: 31

Error: _hrF is not defined
Source File: http://www.activetuning.com/scripts/mmenudom.js
Line: 16

Any ideas what I can do to fix it? If I search “onload” in mmenudom.js there are two instances where it is coded…

cl May 9th, 2006

figured out the answer to question #1 in my previous post (#553), but still stumped on question #2…

KayfabeRockStar May 9th, 2006

Anyone know if you can use this on a link where it draws from a database? Example: output(link) ?>” target=”_blank” rel=”lightbox”> WHERE output(link) ?> pulls the URL. It works normally without LIGHTBOX, but when you use the rel= it will pull up the box and the loading graphic but never load the image. When you hover on the thumbnail it shows the url as http://www.mydomain.com/index.php?=1 or =2, etc. never loads the image though…

Thanks!

Lukas May 9th, 2006

G.R.E.A.T. script. Thanks a lot. I use it in my own php gallery script (www.planetluc.com) which was a quite allright before but your lightbox makes it really great. Thanks again.

Cameron May 9th, 2006

Can someone let me know whats going on with lightbox on my page?

http://www.terrabalandcompany.com/HomesForSale.php

It works perfect in safari and ie6, but with firefox, a second scrollbar appears and the lightbox isn’t centered at all.

Seems like a really weird bug.

Aaryn May 9th, 2006

Hello,
I’d like to use Lightbox on my webpage. Its a digital photography page, hosted on geocities.com. My images are hosted on googlepages because of the storage difference. Lightbox starts to come up, but then the image opens in a blank page instead. So, it makes me wonder – is this a geocities problem, a google problem, or a Lightbox problem? Any thoughts? Thanks!

Jafar May 9th, 2006

Hi;

the script is one of the best one I have seen. Any one could tell me how to put a text on the bottom left hand side. I have a site that I show pics of places and would like to put the places description .

thanks

Sreedharan May 10th, 2006

#558

I think you may forget to define the rel property of the tag..

check it…

Nick (Australia) May 10th, 2006

re 560

HI Jafar,

To add a caption to your photos use the title attribute in the a href tag of your image

eg
a href=”someimage.jpg” rel=”lightbox” title=”Noosa, Qld”

Simon J May 10th, 2006

re #540, 541, 542

SAFARI > lightbox working but apparently the CLOSE BUTTON does not

Well thanks to Jon G I have lightbox working over a flash header in Mac Safari by hiding a header div that contains the flash element (and “replacing” it with a jpg mockup) on clicking a lightbox image and displaying the flash header again on closing the lightbox.

This works a treat on the PC – however now the close button doesn’t apparently work.

So I’m wondering if
A: someone can verify this for me in Safari on the MAC and
B: if someone knows the code to also get it working in Safari

the relevant code is on line 614 of the lightbox.js file:
document.getElementById(‘headerA’).style.display = “block”;

the page is here.
http://scoutphotographics.com.au/draft25.htm

Thanks in advance.

Douglas May 10th, 2006

Didn’t have time to read through all the posts so maybe someone already mentioned this. I’m using Firefox v1.5.0.3 and when I tried your demo some weird things happened. I clicked on the images and they loaded on top the page, but when I right-clicked them, there was no “Save Image As…” on the context menu. Also, the Firefox extension (Image Toolbar) that pops up when you mouseover an image (kinda like in IE) only worked occasionally. It worked for a split second when the image first loaded but disappeared as fast as it appeared.

Anyway, thought you should know.

I’m not knocking Lightbox, just need the above things to work since I’m planning on using a family site with thousands of photos.

Thanks!

finnagin bell May 10th, 2006

JS CONFLICTS ???

I’m a self-educated website hack, and have stumbled my way through several site developments. However I am REALLY TRUELY stuck trying to integrate Lightbox into my latest site rebuild (due to JS conflicts I suspect).

Can anyone help me?

I have the site posted live here http://www.anatomic.com.au/lightbox_ex.htm and the “want-to-be lightbox launcher” is on the 3rd menu rollover “Matrix Pro Road??? , and is the only thumbnail image on the page. [it the not the large rollover image, but the small thumbnail below].

So you know, currently the thumbnail image launches a new page (common JS conflict from what I have read). So I have followed the “quick fix advice??? (to append the initLightbox() to the onload attribute), but to no avail. Any advise would be greatly appreciated!

finnagin bell May 10th, 2006

*** Cancel last order please. I must be tired and need to sleep – a simple src error was my demon.

HOWEVER, I am having issues with the images and and GIF files not displaying inside LB ???????????????

Jens May 10th, 2006

Great script, thanks.

It works fine in Safari and Firefox for me. However, can’t seem to get it running on IE 6.0.28x. Any known issues with that? Also the demo page only opens the images in a new window, no JS applied.

First I thought might be related to the issue with the onLoad in the body tag, but since it is the same for your page, I guess that is not the problem. Any information I can provide to debug this?

Cheers,
Jens

Kerion May 11th, 2006

very stylish! :)

Congratulations for the good work!

Kieran May 11th, 2006

Hi guys,

I’m wondering if anyone can throw any light on a problem i have.

I am building a portfolio-> http://www.picturegrid.net

I’d like to be able to link offsite to a specific page for each photo. For example, any specific photo has a corresponding specific page on another site. I thought maybe i could insert a tag for each image and have lightbox just link to the contents of that tag (like it sucks up the title tag and shows it as a caption).

However i’m not sure how to implement that because every time i try it borks. :)

any ideas?

Nathan May 11th, 2006

Firstly, WOW and thanks for your efforts. I’m currently trying this script on a real estate website (under development) and so far so good, one thing I would really like to do is replace the hover nav links with a nav bar either at the top or bottom of the image, also I’d like to replace the image links with text links… I’m working on it and I’ll get it in the end.

Secondly I would like to back up post #162 by Paul: YOU NEED A FORUM.

For all the attention this script is receiving I think this is the most intelligent comment made so far, the other 99.9% seem to be questions, it’s hard to follow them without some sort of threaded structure making it harder for peeps to get an answer (whether it be from yourself or other users). Please consider this idea, you may find it makes your life (and your supporters lives) easier.

Cheers for the script, I’ll be donating something as soon as I send a site using this scrip live, your effort is much appreciated.

Cheers!

Paul May 11th, 2006

I was wondering if someone could help me with this. I would like the slideshow to loop, so that when you reach the last photo the ‘next’ botton goes back to the beginning.

What do I need to change to have it do that?

Andrew Coggins May 11th, 2006

Hi, I’m using Lightbox 2.0 and I think it’s fantastic!
Can anyone tell me how to change the backgound (around the displayed image) so that it’s both:
1. A different colour
2. More transparent

Also, how about changing the image position height so that the picture appears lower down on the screen?

Thanks!

Andrew.

New and Lost May 11th, 2006

Hi all – First off – I stumbled on this last night and I think it’s great!

I’m currently updating my site but (like some other users here) the pictures are opening on a new page rather than in the same page…and just as a regular pictrue.

It’s almost as if the browser isn’t recognizing the relevant Lightbox files.

Can anyone please help?

Here is the entire code for the test page where LightBox should be working but isn’t:

Gil Arenas Gallery

New And Lost 2 May 11th, 2006

Ok, rookie mistake – the code didn’t show up…trying again:

{header

}

Anonymous May 11th, 2006

i give up…

Spudly May 11th, 2006

First off, I am no expert and know just enough to make myself very dangerous. I read through each and every one of these posts (and I agree that this needs to be a forum!) and a few people have asked how to use Lightbox in a frames environment and there have been a couple of postings about using it with an IFrame. I’ve used Kaz’s instructions (414/416) and they worked well for showing one file but how do I show an array of pictures? To make things even more complicated- how do I utilize LB’s ability to have many arrays by using the rel = lightbox[array] command? Keep in mind I’m a bit slow, so small words would be helpful… :-)

Will H May 12th, 2006

First of all, many thanks Mahesh for your help with my links issue (#501), it was of great help.

Has anyone had this issue with PC firefox:

The lightbox appears beneath the overlay, and the images appear beneath the overlay, as well as below the lightbox.

Looks fine in internet explorer 6. Z-indexes in the css havent been changed from the original code.

Any help would be greatly appreciated.

Thanks,
Will H

Razerz May 12th, 2006

Hello, first of all I wish to thank you for making this fantastic way if displaying pictures. But I have a problem, I want to position the picture higher than default, similar to what #572 wants to do. Another thing, the half-transperant background doesn’t stretch all the way out in IE, there is a small gap at the bottom and at the right side. I have seen a fix on the “official” page, but I don’t understand where to put
body{ margin: 0; padding: 0; }
Any help would be greatly appricicated (wrong spelling, I know, English isn’t my first language).

Connie May 12th, 2006

Hmmm, I thought i posted earlier with a similar problem to New and Lost…. If anyone could help, that would be greatly appreciated… i’ve been trying to figure out what my problem is for the past 2 hours… yea…

But i wanted to thank the author for this code… not very many people like to share… =]

the site that needs help is : http://www.uweb.ucsb.edu/~peachy_cheeks/demo2/mmmdesign.html

please… someone help! i’m going to be fustrated all night!

Anonymous May 12th, 2006

It worked! http://www.gilarenas.net/newgal.html

My users will love it!!! Thank you so much (working on a page redesign and this is the PERFECT [pic gallery)

Don May 12th, 2006

How come the close button image doesn’t show or the loading image? It’s just a blue box with a question mark. Help?

http://flipstah.com/blog

Anonymous May 12th, 2006

In regards to my question in #576, here’s the link to the test site project:

http://www.lausanneschool.com/vtour/map.html

It’s a virtual tour of our school and I’m using LB to display pictures of each of the areas. I’m only wanting the single image to show and then open into an array of pictures. Any suggestions on making this work with iFrames?

wayne May 12th, 2006

i utilized the script for my php gallery here. great stuff.

wayne May 12th, 2006

i utilized the script for my php gallery here: http://www.uffleman.com

great stuff.

Mahesh May 12th, 2006

re: #577

Will,

if you can give a link to the page, it might help in better understanding your problem.

Will H May 12th, 2006

re: #585

Mahesh,

here is a link to my page that I am trying to get working in firefox.

http://willholman.com/newsite/portfolio.php

if you have any further questions, the contact page on my site has my email and screen name. thanks again.

Will H

WIll H May 12th, 2006

Actually Mahesh,
My php contact forum isn’t working, so if you wish to respond to me via email, my address is will@willholman.com

Thanks!

Will H

Elliot Smith May 12th, 2006

Great work. I’m using it on FlickrLilli (http://flicklilli.org.uk/), my Flickr Creative Commons search engine.

Spudly May 12th, 2006

Please forgive my crossposting, but I’m really needing some help on this. This continues the issues I mentioned in 576 and 582:

I’ve figured out how to have the hidden form call for the REL of the pictures:

In the iFrame window, use this code:
[CODE] Click image

[/CODE]

In the Main frame window, use this code:
[CODE]

function lBiFrame(obj) { //Create the function for your onclick event in your link…
var iframe = window.frames['cwindow']; //this has to be the name of your iframe.
var iframeForm = iframe.document.lBiFrame_form; //this has to be the name of your frame and your form.
var hrefvalue = iframeForm.LightBox_iFrame_imgUrl.value; //this has to be the name of your “Image URL” hidden field.
var titlevalue = iframeForm.LightBox_iFrame_imgTitle.value; //this has to be the name of your “Image Title” hidden field.
var relvalue = iframeForm.LightBox_iFrame_imgRel.value; //this has to be the name of your “rel” hidden field.
var simulated_iFrameLink = document.createElement(‘a’); //Creates a href object
simulated_iFrameLink.setAttribute(‘href’, hrefvalue); //Sets the href object to your lightbox image.
simulated_iFrameLink.setAttribute(‘title’, titlevalue); //Sets the title object to your lightbox image.
simulated_iFrameLink.setAttribute(‘rel’, ‘lightbox’, relvalue); //Sets rel href object to your lightbox image.
//alert (‘href: ‘ + hrefvalue + “, Title: ” + titlevalue + ‘, rel: lightbox’ + relvalue); //For debug, to test if href, title, and rel are passed correctly..
myLightbox.start(simulated_iFrameLink); //Starts lightBox
}

[/CODE]

Here’s my problem- how do I now execute the rest of the images. I’ve tried placing them on the main page, placing them in the iFrame, creating more hidden forms, etc. Anyone have a clue as to how to make this work? Any help would be greatly appreciated!

Philipp May 13th, 2006

Great work, much apprechiated. Will be part of the next ZEITDENKEN to be found at http://zeitdenken.de next month or so.

Anonymous May 13th, 2006

I have updated to the new version, and it works great in FF. Although it doesnt work in IE at all. Two things happen, if im opening a single pic it shows it loading, but then opens in a new page. And if i click on a group image it just opens in a new window. What do i need to do to fix this and get it to work both in IE and FF?

Tyz May 14th, 2006

Love this script great work.
But I ran into a small usabillity problem, when using a set of images it becomes impossible to save the image with right click->save image as, because the image is a link to next or previous image. You can only save or copy the link informatie and not the image itself.
Is there a simple solution fot this?

ed May 14th, 2006

love lightbox.

question, though…. i’m puting together a site that uses the Rico toolkit, specifically the “accordian” div effect. i’m trying to get lightbox to work with it to display a gallery and i just can’t get it to work. since the Rico stuff requires an “onload” call, i did the “init” method but to no avail. anything i’m missing to get this to work?

thanks for any advice you can give me. keep up the great work!

Mahesh May 14th, 2006

Re: 586

Will,

I got it to work in Firefox with some modifications. I removed lightbox related styles from green.css back into lightbox.css. In the process I messed up the Tooltop effect. So u may have to debug that. Check it out here: http://www.mahesh.net/lightbox/holman

Anonymous May 14th, 2006

#594

Mahesh,

Thank you so much. I thought I had tried using the lightbox styles seperately, but I guess I hadn’t. Was there any other modifications you made? Hopefully I can get my tooltips working in conjunction as well. Thanks again, you have been a huge help.

Will H

Will H May 14th, 2006

Re: #594

Mahesh,

I got the tooltips working as well, I moved the css for them into their own style sheet as well, check it out!

http://willholman.com/newsite/portfolio.php

I know that this isn’t directly a lightbox-related question which I apologize for posting on here, but I was unable to locate your email address on your website. I’m having trouble with my tooltips, I only want them to show up when you roll over my thumbnails, not on every link on my page. They also show up on the lightbox next and previous buttons, as well as the close button, which I do not want.

If you have time to look over this, I would greatly appreciate it. Thanks so much again for all your help.

Thanks,
Will H

Mahesh May 15th, 2006

Re: #596

Will,

I know exactly what u are facing. I had some time back tried “SweetTitles” alongwith Lightbox. I thought of a solution but haven’t really had the time to implement it. I will try it out and let you know if I have a solution.

Will H May 15th, 2006

Re: #597

Mahesh,

Thank you so much, you have been an amazing help!

Will H

Nathan May 15th, 2006

@ #593ed

Have you tried the mooFx toolkit, it uses the same js library (prototype.js) as lightbox2, you might find it more compatible. It does the accordion thing you’re talking about too.

http://moofx.mad4milk.net/

@ a couple of posters who have mentioned the dotted border around the anchor tags, you can remove this with some simple css.

a {
outline:none;
}

@ a couple of other posters, if your close button image and or loading image is not showing up try changing the path in the config part of the js to an absolute path i.e.

var fileLoadingImage = “http://www.sitename.com/pathtoimg/loading.gif”;

var fileBottomNavCloseImage = “http://www.sitename.com/pathtoimg/closelabel.gif”;

This works for me 100% of the time, I had trouble with relative paths.

to anyone having trouble getting lightbox up and running, the first thing to do is check you code, then check it again, then once more to be sure. Once you are positive your code and paths are correct and it still wont work leave a message. Looking at some of the posts here I’d say most of the problems are not due to lightbox but a misunderstanding of the code you are writing (not to say you’re all dumb).

I’ve come across the same issues as some of the posts here and 9 times out of 10 it was something I did wrong.

Also on my last post I mentioned I was trying to remove the hover nav and replace it with a text based nav bar, I got this working with relative ease, a credit to your well written code Mahesh. If anyone is interested in how I did this say the word and I’ll post the code.

Cheers.

Anonymous May 15th, 2006

Hi.

LB is really great.

Any reason why I am getting a blue border around my thumbnail?

Thanks

Nathan May 15th, 2006

@ #600

CSS:

a img {
border:0;
}

I forgot to ask my question, I have noticed a few people want to know the same thing. Is there any way to change the offset from the top of the browser, my images take up the best part of the screen meaning the bottom of the lightbox is below the bottom of the screen. If I could change the current offset by 10px I’d be right, but changing the height in the CSS has no effect. How can it be changed?

Cheers!

Anonymous May 15th, 2006

@#601

Thanks Nathan! Blue border is gone now.

Cheers!

Chris May 15th, 2006

Very impressive script… but I NEED HELP!!!

I previously saw where someone had posted a modified script on this msg board with tabbed/gallery functionality. I designed a static example of what his modified script resembled at: http://www.mysticonline.com/dev/lightbox_mod.jpg

I’ve gone through most of the msgs and can’t locate the original post with the mod script web address. Can someone tell me where to find it?

Basically, I’m trying to get the script to cycle through multiple images of independent galleries when only displaying one text link or thumbnail for each gallery.

I’d like to list multiple party dates (galleries) plus one thumbnail each as links, each of which will contain 40-80 photos in each gallery (sets), and when the user clicks on any date, it will launch the lightbox which in turn displays the specific gallery and all related photos in the set. The tabs at the top of the lightbox allow the user to switch between galleries without having to close the lightbox.

Example:
• Party #1 Jan 10th (one clickable thumbnail here)
…[this would link to gallery #1 containing 40 related photos in the set]

• Party #2 Feb 14th (one clickable thumbnail here)
…[this would link to gallery #2 containing 60 related photos in the set]

• Party #3 Mar 5th (one clickable thumbnail here)
…[this would link to gallery #3 containing 80 related photos in the set]
Etc….

Someone please help!
mrmystic@bellsouth.net

Michael May 15th, 2006

Hi,

I’m using Lighbox and some of you have asked about the blinking cursor in firefox. I fixed this in my script.
You only have to add
if (!document.all) document.getElementById(‘prevLink’).focus();

to the showImage: function(){

It sets the focus on a hidden element and the curor is gone in Firefox. You have to use the document.all because ie does not allow this (and don’t has this problem anyway).

I hop I helped someone :).

/michael

Mahesh May 15th, 2006

re: #596

It turned out to be easier than I thought to fix the problem of the blank tooltips and its not even a hack.

In sweetTitles.js look for this block of code (around line 29)
for ( j=0; j

Mahesh May 15th, 2006

re: #596

It turned out to be easier than I thought to fix the problem of the blank tooltips and its not even a hack.

In sweetTitles.js look for this block of code (around line 29)
for ( j=0; j<curLen; j++ ) {
addEvent(current[j],’mouseover’,this.tipOver);
addEvent(current[j],’mouseout’,this.tipOut);
current[j].setAttribute(‘tip’,current[j].title);
current[j].removeAttribute(‘title’);
}

After the opening brace of the for loop just add this line .

if (current[j].getAttribute(‘title’) == null) continue;

Now the above block should look like this
for ( j=0; j<curLen; j++ ) {
// Quick check for Tags that don’t have ‘title’
if (current[j].getAttribute(‘title’) == null) continue;

addEvent(current[j],’mouseover’,this.tipOver);
addEvent(current[j],’mouseout’,this.tipOut);
current[j].setAttribute(‘tip’,current[j].title);
current[j].removeAttribute(‘title’);
}

That should do it.

jan peter adams May 15th, 2006

Very impressive script… but I NEED HELP!!!

I previously saw where someone had posted a modified script on this msg board with tabbed/gallery functionality. I designed a static example of what his modified script resembled at: http://www.mysticonline.com/dev/lightbox_mod.jpg

I’ve gone through most of the msgs and can’t locate the original post with the mod script web address. Can someone tell me where to find it?

Basically, I’m trying to get the script to cycle through multiple images of independent galleries when only displaying one text link or thumbnail for each gallery.

I’d like to list multiple party dates (galleries) plus one thumbnail each as links, each of which will contain 40-80 photos in each gallery (sets), and when the user clicks on any date, it will launch the lightbox which in turn displays the specific gallery and all related photos in the set. The tabs at the top of the lightbox allow the user to switch between galleries without having to close the lightbox.

Example:
• Party #1 Jan 10th (one clickable thumbnail here)
…[this would link to gallery #1 containing 40 related photos in the set]

• Party #2 Feb 14th (one clickable thumbnail here)
…[this would link to gallery #2 containing 60 related photos in the set]

• Party #3 Mar 5th (one clickable thumbnail here)
…[this would link to gallery #3 containing 80 related photos in the set]
Etc….

Someone please help!
michielseerden@hotmail.com

Tiggr May 15th, 2006

Just a small tipp: For alternative loading images, have a look at http://www.ajaxload.info/

Tarb May 15th, 2006

Love the script – just a quick question – what controls the positioning of the close box? I’m trying to move it to the top of the image instead of the bottom…

Anonymous May 15th, 2006

Works great on pages without flash objects. However, I tried it on a page where I have a flas movie playing, whenever I click on the thumb, the new image opens up just fine, the effects are working, BUT the .swf movie overlaps the new image