Lightbox JS v2.0

Lightbox JS v2.0 - Go check it out!

Use the comments on this entry to post and discuss bugs, questions, and troubleshoot the script. I’ll be in and out of here.

3/31/06: I’ve Released a minor update v2.01 that fixes IE6 centering and smooths out the kinks in the resize transition. If you’re looking for multi-line captions or keyboard navigation, expect another minor update this weekend.

4/4/06: New update v2.02 that keeps the layout in check when captions extend to multiple lines. Keyboard navigation has also been enabled. Lastly, the addition of a variable in the lightbox.js configuration section to control the speed of the resize transitions.

Mar 27, 2006
Naina

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.

Mar 27, 2006
oneiros

/is excited

Mar 27, 2006
macx

What’s new on Lighbox 2.0?

Mar 27, 2006
codecraig

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!

Mar 27, 2006
T aka!

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

Mar 27, 2006
Rich

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

Mar 27, 2006
Colin Cameron

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

Mar 27, 2006
Kevin

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

Mar 27, 2006
Jesús Acuña

Wow I cant wait for it :)

Mar 27, 2006
Jason Levine

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. :-)

Mar 27, 2006
Jim Connolly

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

Mar 28, 2006
Sunil

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

Mar 28, 2006
Jack Black

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

Mar 28, 2006
James

Oh my God…

Mar 28, 2006
oneiros

James wrote: “Oh my God…”

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

Mar 28, 2006
Emmanuel Okorie

Totally gobsmacked….

Mar 28, 2006
stabani

definetly stunning.. waiting for it anxiously indeed.

Mar 28, 2006
Kevin

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.

Mar 28, 2006
Judy

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.

Mar 28, 2006
Koka

lightbox roqs. the demos are great.

Mar 28, 2006
Jeremy

Beautiful.

Mar 28, 2006
Big Dave

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

Mar 28, 2006
Enzo Santagata

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

Mar 28, 2006
Anonymous Coward

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

Mar 28, 2006
fens

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

Mar 28, 2006
Serge

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

Mar 28, 2006
Jason Levine

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.)

Mar 28, 2006
Dan

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.

Mar 28, 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.

Mar 28, 2006
AsceticMonk

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!

Mar 28, 2006
ian

I like the improvements

Mar 28, 2006
Mar 28, 2006
Renduvall

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??

Mar 28, 2006
Renduvall

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.

Mar 28, 2006
Magnus

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

Mar 28, 2006
Kavita

Its cool……. Like the improvements…

Keep it up…

http://www.ajaximpact.com

Mar 28, 2006
Colin Cameron

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.

Mar 29, 2006
zOlive

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 !

Mar 29, 2006
Colin Cameron

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

Mar 29, 2006
Patric

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.

Mar 29, 2006
Acha Ladka

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

Mar 29, 2006
Acha Ladka

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

Mar 29, 2006
blackshtef

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

Mar 29, 2006
codecraig
Mar 29, 2006
Dan

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

Mar 29, 2006
Taka!

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!

Mar 29, 2006
Anonymous

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

Mar 29, 2006
NOGG3R5

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!

Mar 29, 2006
Kean Tat

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

Mar 29, 2006
Anonymous

Excellent job, thanks much

Mar 29, 2006
Jason Levine

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.)

Mar 29, 2006
graywave

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

Mar 29, 2006
Jeff Luckett

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?

Mar 29, 2006
Chuck Reynolds

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

Mar 29, 2006
Serge

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!

Mar 29, 2006
Joram Oudenaarde

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!

Mar 29, 2006
torneco

brilliant!!

can I use this for commercial-use?

Mar 29, 2006
NM

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.

Mar 29, 2006
Rushi Vishavadia

Lokesh,

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

Rushi

Mar 29, 2006
maro

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.

Mar 29, 2006
Will Stumpf

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
www.willstumpf.com

Mar 29, 2006
ivar

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

Mar 29, 2006
mikali

Excellent Work… this is very well done.

http://mobiko.blogs.com/mutant

Mar 29, 2006
JackO

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

ojacko

Mar 29, 2006
will

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!

Mar 29, 2006
ivar

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?

Mar 29, 2006
Jonny Rocket

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.)?

Mar 29, 2006
Prashant

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

Great work!

Mar 29, 2006
joeee

Person #1:: Who’s the man?

The World:: Lokesh is the man

Mar 29, 2006
ivar

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

Mar 29, 2006
will

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

Mar 29, 2006
Koka

Mar 29, 2006
NM

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 ……

Mar 29, 2006
Mauti

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

Mar 29, 2006
Mauti

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.

Mar 29, 2006
Kevin

Here it is incorporated into our site!

Ezell Aviation

Check the latest P-38 update.

Mar 29, 2006
onlyUMPC.com

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

Mar 29, 2006
Michael McCorry

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.

Mar 29, 2006
Carlton Dickson

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

Mar 29, 2006
BillSaysThis

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?

Mar 29, 2006
banglogic

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²

Mar 29, 2006
Bart

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

Mar 29, 2006
codecraig

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

woo-hoo!!

Mar 30, 2006
Alex

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!

Mar 30, 2006
Jason

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.

Mar 30, 2006
Ryan

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

Mar 30, 2006
Ravin

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?

Mar 30, 2006
preben

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

Mar 30, 2006
Floria

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.

Mar 30, 2006
Dan

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?

Mar 30, 2006
Otter

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

Mar 30, 2006
audienceone

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

Mar 30, 2006
kristine

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

Mar 30, 2006
Dave

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)

Mar 30, 2006
Preben

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!!!

Mar 30, 2006
Toadward

really nice work !!!
thank you

Mar 30, 2006
peppe

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

Mar 30, 2006
Jono | Iconaholic

Brilliant work!
Donation sent :)

Mar 30, 2006
Scott

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.

Mar 30, 2006
Mark L.

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 :)

Mar 31, 2006
Mark L.

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.

Mar 31, 2006
Jeremy C.

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.

Mar 31, 2006
Paul

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

Excellent work.

www.pauljamesdesign.com.au

Mar 31, 2006
tripdragon

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

Mar 31, 2006
Brandon

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

Mar 31, 2006
ecila

very hot.

Mar 31, 2006
Gabriel Bratescu

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

Mar 31, 2006
Ethan

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

-Ethan

Mar 31, 2006
Preben

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

Mar 31, 2006
Tiggr

Hi!

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

Thank you very much!

Mar 31, 2006
Gabriel

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 :)

Mar 31, 2006
Johannes Theile

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

Johannes

Mar 31, 2006
Gabriel

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

Mar 31, 2006
DimP

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.

Mar 31, 2006
oldskull

sagerao! lo usare!!!!

Mar 31, 2006
Kezia P

So far I Love the modification

Mar 31, 2006
jc

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

Mar 31, 2006
bish

Anyone have the 2.0 zip file around.

2.01’s movement/positioning are all borked up.

Mar 31, 2006
Safirul Alredha

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/

Mar 31, 2006
Colin Cameron

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

Mar 31, 2006
Jerry

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.

Mar 31, 2006
Juani

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…

Mar 31, 2006
ryan

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?

Mar 31, 2006
Paul Payne

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)?

Mar 31, 2006
Steven Hagen

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?

Mar 31, 2006
Floria

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!

Mar 31, 2006
Ben

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?

Mar 31, 2006
Ben

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.

Mar 31, 2006
Brandon

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.

Mar 31, 2006
paul

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?

Mar 31, 2006
paul

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.

Mar 31, 2006
Anonymous

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

Mar 31, 2006
nacho

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

Mar 31, 2006
nacho

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

Mar 31, 2006
zeek

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

Apr 1, 2006
Safirul Alredha

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.

Apr 1, 2006
Antti Tuppurainen

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.

Apr 1, 2006
TotoMat

Hi,
got a problem under Mozilla 1.5+ and firefox

Apr 1, 2006
ToToMat the return

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

Apr 1, 2006
Mike

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?

Apr 1, 2006
Mike

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…

Apr 1, 2006
nico

im having the same issue posted in #139

any ideas?

Apr 1, 2006
Vladimir

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

Apr 1, 2006
sialivi

#143 Vladimir,

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

Apr 2, 2006
Rbt.

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.

Apr 2, 2006
Erby

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

Apr 2, 2006
Hieu

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

Apr 2, 2006
Hieu

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

Apr 2, 2006
ROFL

ROlF?

Apr 2, 2006
Resnumerica

thanks !

K

Apr 2, 2006
Viking KARWUR

Thanks… it’s rocks!

Greetings from Indonesia.

Apr 2, 2006
Keith

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.

Apr 2, 2006
Lewis

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…

Apr 2, 2006
surfer66

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

Apr 2, 2006
Jeff

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.

Apr 2, 2006
the fly

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

Apr 2, 2006
Torsten

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 www.aahren.com/photos/

Thanks a lot

Apr 2, 2006
Vladimir

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 :)

Apr 2, 2006
Yuvraj Kalra

So great… Thanks

Apr 3, 2006
Jeranon

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

Apr 3, 2006
anthonyjhicks

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.

Apr 3, 2006
Paul

YOU NEED TO SET UP A FORUM!!!!

Apr 3, 2006
Amy

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,

Apr 3, 2006
joseph tate

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.

Apr 3, 2006
Danilo Laurindo

Just great! :)

Works perfectly!

Apr 3, 2006
NM

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)

Apr 3, 2006
Edward

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

Apr 3, 2006
Mike

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?

Apr 3, 2006
Grady

Is there a way to make the caption height taller? When the title is long enough to fit on 3 line