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.
#1 Naina
March 27, 2006 @ 3:43 am
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.
#2 oneiros
March 27, 2006 @ 3:46 am
/is excited
#3 macx
March 27, 2006 @ 4:34 am
What's new on Lighbox 2.0?
#4 codecraig
March 27, 2006 @ 6:25 am
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!
#5 T aka!
March 27, 2006 @ 11:13 am
And? almost finished? Can't wait! :-)
#6 Rich
March 27, 2006 @ 11:27 am
making whats already great even better!
Lokesh is my hero.
#7 Colin Cameron
March 27, 2006 @ 11:46 am
Very exciting! My money is on the slideshow feature we have been hearing about.
#8 Kevin
March 27, 2006 @ 1:23 pm
woot woot! I will be checking back often, very excited!
#9 Jesús Acuña
March 27, 2006 @ 2:45 pm
Wow I cant wait for it :)
#10 Jason Levine
March 27, 2006 @ 3:15 pm
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. :-)
#11 Jim Connolly
March 27, 2006 @ 3:18 pm
You need to slow down, you're making the rest of us look bad.
#12 Sunil
March 28, 2006 @ 1:54 am
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
#13 Jack Black
March 28, 2006 @ 2:42 am
#11: On the contrary, you need to speed up.
#14 James
March 28, 2006 @ 3:14 am
Oh my God…
#15 oneiros
March 28, 2006 @ 5:06 am
James wrote: "Oh my God…"
You took the words right out of my mouth. Stunning!
#16 Emmanuel Okorie
March 28, 2006 @ 5:13 am
Totally gobsmacked….
#17 stabani
March 28, 2006 @ 7:17 am
definetly stunning.. waiting for it anxiously indeed.
#18 Kevin
March 28, 2006 @ 9:15 am
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.
#19 Judy
March 28, 2006 @ 11:22 am
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.
#20 Koka
March 28, 2006 @ 11:30 am
lightbox roqs. the demos are great.
#21 Jeremy
March 28, 2006 @ 11:40 am
Beautiful.
#22 Big Dave
March 28, 2006 @ 12:06 pm
WOW, This is awesome! Thanks for setting the bar even higher!
#23 Enzo Santagata
March 28, 2006 @ 12:12 pm
I thought Lightbox is exciting and could never be one better. Then Lightbox 2.0! Great
Waiting for the release
#24 Anonymous Coward
March 28, 2006 @ 1:47 pm
This is *very* exciting. Thanks for all you do and letting us humble script kitties use your brilliant work!!!!
#25 fens
March 28, 2006 @ 1:54 pm
http://www.huddletogether.com/projects/lightbox2/ seems to be the new page for v2 :P course it might not be since its more a holding page
#26 Serge
March 28, 2006 @ 2:07 pm
The preview does not seem to work in Firefox 1.5 for Windows. Has anyone else had this problem? Works fine in IE.
#27 Jason Levine
March 28, 2006 @ 2:43 pm
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.)
#28 Dan
March 28, 2006 @ 3:01 pm
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.
#29 Lokesh
March 28, 2006 @ 4:00 pm
#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.
#30 AsceticMonk
March 28, 2006 @ 4:28 pm
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!
#31 ian
March 28, 2006 @ 4:42 pm
I like the improvements
#32 Caius Durling
March 28, 2006 @ 4:55 pm
http://www.huddletogether.com/js/lightbox.js
#33 Renduvall
March 28, 2006 @ 5:43 pm
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??
#34 Renduvall
March 28, 2006 @ 5:53 pm
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.
#35 Magnus
March 28, 2006 @ 7:29 pm
Awesome. I'm going to be using a modified lightbox for my wordpress blog. Thanks for making such a useful script!
#36 Kavita
March 28, 2006 @ 8:21 pm
Its cool……. Like the improvements…
Keep it up…
http://www.ajaximpact.com
#37 Colin Cameron
March 28, 2006 @ 8:41 pm
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.
#38 zOlive
March 29, 2006 @ 12:01 am
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 !
#39 Colin Cameron
March 29, 2006 @ 12:59 am
OK, it works for me now.. Its glorious!
#40 Patric
March 29, 2006 @ 3:49 am
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.
#41 Acha Ladka
March 29, 2006 @ 5:00 am
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
#42 Acha Ladka
March 29, 2006 @ 5:04 am
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
#43 blackshtef
March 29, 2006 @ 6:37 am
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
#44 codecraig
March 29, 2006 @ 6:37 am
Digg it!
#45 Dan
March 29, 2006 @ 8:10 am
Lokesh just tested it in IE7 and Firefox 2.0a1 and works a treat very nice work!
#46 Taka!
March 29, 2006 @ 9:07 am
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!
#47 Anonymous
March 29, 2006 @ 10:32 am
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
#48 NOGG3R5
March 29, 2006 @ 10:52 am
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!
#49 Kean Tat
March 29, 2006 @ 11:05 am
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
#50 Anonymous
March 29, 2006 @ 11:16 am
Excellent job, thanks much
#51 Jason Levine
March 29, 2006 @ 11:30 am
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.)
#52 graywave
March 29, 2006 @ 11:48 am
Very nice. Is this LightShow added to LightBox? Or will LightShow be a different script?
#53 Jeff Luckett
March 29, 2006 @ 12:20 pm
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?
#54 Chuck Reynolds
March 29, 2006 @ 12:38 pm
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
#55 Serge
March 29, 2006 @ 12:47 pm
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!
#56 Joram Oudenaarde
March 29, 2006 @ 12:57 pm
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!
#57 torneco
March 29, 2006 @ 1:13 pm
brilliant!!
can I use this for commercial-use?
#58 NM
March 29, 2006 @ 1:31 pm
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.
#59 Rushi Vishavadia
March 29, 2006 @ 1:36 pm
Lokesh,
That is some amazing work on LightBox 2.0. Really well done! A good example about the power of JavaScript
Rushi
#60 maro
March 29, 2006 @ 2:03 pm
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.
#61 Will Stumpf
March 29, 2006 @ 2:06 pm
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
#62 ivar
March 29, 2006 @ 2:24 pm
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
#63 mikali
March 29, 2006 @ 3:00 pm
Excellent Work… this is very well done.
http://mobiko.blogs.com/mutant
#64 JackO
March 29, 2006 @ 3:02 pm
Hey, great to see the progress! I updated my photo gallery with the script too!
ojacko
#65 will
March 29, 2006 @ 3:48 pm
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!
#66 ivar
March 29, 2006 @ 3:57 pm
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?
#67 Jonny Rocket
March 29, 2006 @ 4:02 pm
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.)?
#68 Prashant
March 29, 2006 @ 4:15 pm
I just took a look at the demo, there's only one word I can say, amazing!
Great work!
#69 joeee
March 29, 2006 @ 4:20 pm
Person #1:: Who's the man?
The World:: Lokesh is the man
#70 ivar
March 29, 2006 @ 4:24 pm
#67: My doctype is set (HTML 4.01 Strict), and the code is validated.
#71 will
March 29, 2006 @ 4:41 pm
thanks, johnny rocket, that was it. works properly in ie now
#72 Koka
March 29, 2006 @ 4:49 pm
#73 NM
March 29, 2006 @ 5:01 pm
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 ……
#74 Mauti
March 29, 2006 @ 5:15 pm
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
#75 Mauti
March 29, 2006 @ 5:18 pm
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.
#76 Kevin
March 29, 2006 @ 5:57 pm
Here it is incorporated into our site!
Ezell Aviation
Check the latest P-38 update.
#77 onlyUMPC.com
March 29, 2006 @ 5:59 pm
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
#78 Michael McCorry
March 29, 2006 @ 6:49 pm
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.
#79 Carlton Dickson
March 29, 2006 @ 7:22 pm
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
#80 BillSaysThis
March 29, 2006 @ 7:31 pm
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?
#81 banglogic
March 29, 2006 @ 7:57 pm
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²
#82 Bart
March 29, 2006 @ 9:07 pm
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
#83 codecraig
March 29, 2006 @ 9:29 pm
wow…I posted this story on Digg an over 1100 diggs!!!
woo-hoo!!
#84 Alex
March 30, 2006 @ 12:31 am
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!
#85 Jason
March 30, 2006 @ 2:08 am
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.
#86 Ryan
March 30, 2006 @ 3:00 am
I just recently came across your gallery system and I am simply amazed. Its freakin awesome. - Ryan
#87 Ravin
March 30, 2006 @ 6:04 am
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?
#88 preben
March 30, 2006 @ 10:23 am
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
#89 Floria
March 30, 2006 @ 11:24 am
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.
#90 Dan
March 30, 2006 @ 11:54 am
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?
#91 Otter
March 30, 2006 @ 11:55 am
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
#92 audienceone
March 30, 2006 @ 12:15 pm
Great script! May I give you a pat? *pat*
#93 kristine
March 30, 2006 @ 12:26 pm
You made my day! :-) Really good job.
#94 Dave
March 30, 2006 @ 12:32 pm
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)
#95 Preben
March 30, 2006 @ 1:42 pm
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!!!
#96 Toadward
March 30, 2006 @ 2:25 pm
really nice work !!!
thank you
#97 peppe
March 30, 2006 @ 4:07 pm
I create a wordpress plugin based on your script.
http://www.4mj.it/lightbox-js-v20-wordpress/
#98 Jono | Iconaholic
March 30, 2006 @ 6:27 pm
Brilliant work!
Donation sent :)
#99 Scott
March 30, 2006 @ 7:10 pm
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.
#100 Mark L.
March 30, 2006 @ 9:30 pm
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 :)
#101 Mark L.
March 31, 2006 @ 12:19 am
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.
#102 Jeremy C.
March 31, 2006 @ 12:27 am
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.
#103 Paul
March 31, 2006 @ 12:44 am
I'm blown away by this! Your hard work and attention to detail is outstanding.
Excellent work.
www.pauljamesdesign.com.au
#104 tripdragon
March 31, 2006 @ 1:22 am
are there plans to dynamicly build image list gallerys with this ???
Like stick the index folder in a folder with lots of images
#105 Brandon
March 31, 2006 @ 1:23 am
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
#106 ecila
March 31, 2006 @ 2:12 am
very hot.
#107 Gabriel Bratescu
March 31, 2006 @ 5:08 am
Very very nice.
But i have a problem:
For Preben on #88: How did you rezolved that problem ?
#108 Ethan
March 31, 2006 @ 5:22 am
isn't there a feature to automatically resize large images to fit inside the screen?
-Ethan
#109 Preben
March 31, 2006 @ 5:29 am
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
#110 Tiggr
March 31, 2006 @ 8:07 am
Hi!
The new version works fine for me at: http://www.colorful-sky.de/workshop/index.php?idcatside=79
Thank you very much!
#111 Gabriel
March 31, 2006 @ 8:12 am
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 :)
#112 Johannes Theile
March 31, 2006 @ 8:15 am
Such a great gizmo! How could I have lived without! *gg*
Please continue the great work!
Johannes
#113 Gabriel
March 31, 2006 @ 8:42 am
Problem resolved: in lightbox.ccs instead of "53% left" i put "left 53%" , same change for right. Not working in Firefow 1.5 …….
#114 DimP
March 31, 2006 @ 10:25 am
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.
#115 oldskull
March 31, 2006 @ 11:03 am
sagerao! lo usare!!!!
#116 Kezia P
March 31, 2006 @ 11:32 am
So far I Love the modification
#117 jc
March 31, 2006 @ 12:14 pm
chulo chulo… muyyyyyyyyyy chulo…
thx for the work!!
;)
#118 bish
March 31, 2006 @ 1:06 pm
Anyone have the 2.0 zip file around.
2.01's movement/positioning are all borked up.
#119 Safirul Alredha
March 31, 2006 @ 1:32 pm
I've switch
addLoadEvent()to scriptaculousEvent.Observefor event handling. Plus I'm sort of updating my previous Lightbox plugin — http://zeo.unic.net.my/2006/03/29/lightbox-js-version-20/#120 Colin Cameron
March 31, 2006 @ 1:59 pm
Does anyone else have to put the full url to the images in the lightbox.js? They will only show up if I do.
#121 Jerry
March 31, 2006 @ 4:07 pm
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.
#122 Juani
March 31, 2006 @ 4:29 pm
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…
#123 ryan
March 31, 2006 @ 4:31 pm
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?
#124 Paul Payne
March 31, 2006 @ 4:37 pm
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)?
#125 Steven Hagen
March 31, 2006 @ 4:45 pm
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?
#126 Floria
March 31, 2006 @ 4:53 pm
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.huddletogether.com/projects/lightbox2/
v2.01 - Centering in IE6 (any DOCTYPE) fixed.
Smoothed out resize transition.
Good luck!
#127 Ben
March 31, 2006 @ 5:30 pm
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?
#128 Ben
March 31, 2006 @ 5:32 pm
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.
#129 Brandon
March 31, 2006 @ 7:43 pm
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.
#130 paul
March 31, 2006 @ 8:22 pm
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?
#131 paul
March 31, 2006 @ 8:38 pm
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.
#132 Anonymous
March 31, 2006 @ 9:16 pm
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
#133 nacho
March 31, 2006 @ 10:14 pm
Using wz_tooltips makes the caption disappear. It doesn't seem to be a font color issue. Is there a way around that?
#134 nacho
March 31, 2006 @ 10:27 pm
Nevermind, replacing the first instance of "title" in lightbox.js with "alt" and putting the caption into the alt text restores the caption.
#135 zeek
March 31, 2006 @ 11:28 pm
It would be nice, to be able to insert links into the caption.
#136 Safirul Alredha
April 1, 2006 @ 12:09 am
If you use
loadingID 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
loadingID's in lightbox.js and lightbox.css to something else that's unique or vise versa.#137 Antti Tuppurainen
April 1, 2006 @ 8:30 am
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.
#138 TotoMat
April 1, 2006 @ 11:05 am
Hi,
got a problem under Mozilla 1.5+ and firefox
#139 ToToMat the return
April 1, 2006 @ 11:07 am
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
#140 Mike
April 1, 2006 @ 11:58 am
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?
#141 Mike
April 1, 2006 @ 12:20 pm
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…
#142 nico
April 1, 2006 @ 12:57 pm
im having the same issue posted in #139
any ideas?
#143 Vladimir
April 1, 2006 @ 5:43 pm
to #132: after you change the innerHTML of a div, run initLightbox()
#144 sialivi
April 1, 2006 @ 9:42 pm
#143 Vladimir,
I have the same problem, but calling initLightbox() after the update doesn't seem to help.
#145 Rbt.
April 2, 2006 @ 12:00 am
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.
#146 Erby
April 2, 2006 @ 12:12 am
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
#147 Hieu
April 2, 2006 @ 3:46 am
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
#148 Hieu
April 2, 2006 @ 3:51 am
I forgot to mention that test browser is FF 1.5. This does not happen in IE 6.0
#149 ROFL
April 2, 2006 @ 3:07 am
ROlF?
#150 Resnumerica
April 2, 2006 @ 5:00 am
thanks !
K
#151 Viking KARWUR
April 2, 2006 @ 8:53 am
Thanks… it's rocks!
Greetings from Indonesia.
#152 Keith
April 2, 2006 @ 8:59 am
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.
#153 Lewis
April 2, 2006 @ 11:22 am
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…
#154 surfer66
April 2, 2006 @ 11:44 am
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
#155 Jeff
April 2, 2006 @ 12:28 pm
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.
#156 the fly
April 2, 2006 @ 3:31 pm
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
#157 Torsten
April 2, 2006 @ 6:21 pm
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
#158 Vladimir
April 2, 2006 @ 10:03 pm
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 :)
#159 Yuvraj Kalra
April 2, 2006 @ 10:59 pm
So great… Thanks
#160 Jeranon
April 3, 2006 @ 5:44 am
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
#161 anthonyjhicks
April 3, 2006 @ 6:14 am
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.
#162 Paul
April 3, 2006 @ 8:05 am
YOU NEED TO SET UP A FORUM!!!!
#163 Amy
April 3, 2006 @ 8:07 am
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,
#164 joseph tate
April 3, 2006 @ 9:06 am
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.
#165 Danilo Laurindo
April 3, 2006 @ 9:47 am
Just great! :)
Works perfectly!
#166 NM
April 3, 2006 @ 10:20 am
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)
#167 Edward
April 3, 2006 @ 12:05 pm
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
#168 Mike
April 3, 2006 @ 1:32 pm
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?
#169 Grady
April 3, 2006 @ 1:32 pm
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
#170 Anonymous
April 3, 2006 @ 1:35 pm
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 ;)
#171 Anonymous
April 3, 2006 @ 1:38 pm
To Grady #169
In the stylesheet, locate: #imageDataContainer{
and change the height, which is currently 38px to your desired height…
#172 Johno
April 3, 2006 @ 1:44 pm
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!
#173 eric
April 3, 2006 @ 2:43 pm
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
#174 Grady
April 3, 2006 @ 3:41 pm
Thanks poster #171 :o) … I shortly found that myself.
#175 Anonymous
April 3, 2006 @ 3:47 pm
sads
#176 Buzz
April 3, 2006 @ 3:50 pm
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
#177 Brent Dillingham
April 3, 2006 @ 5:26 pm
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.
#178 Rizky
April 3, 2006 @ 6:32 pm
yaiksss! it hasn't been a month since i used the first version. and now there's the second one. awesome…
#179 MN
April 3, 2006 @ 7:07 pm
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.
#180 Sean K
April 3, 2006 @ 8:01 pm
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
#181 Sean K
April 3, 2006 @ 8:01 pm
Sorry that last post was so long, no other way to get all the information in there…
#182 los
April 3, 2006 @ 8:09 pm
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.
#183 Sean K
April 3, 2006 @ 11:13 pm
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
#184 dleifm
April 4, 2006 @ 12:10 am
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.
#185 Rom S
April 4, 2006 @ 1:31 am
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.
#186 Walter
April 4, 2006 @ 4:22 am
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!
#187 uncle wilco
April 4, 2006 @ 4:27 am
Hi donation sent, using it on my shed site
www.readersheds.co.uk/readersheds/share.cfm
wilco
#188 Jono | Iconaholic
April 4, 2006 @ 4:50 am
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 :)
#189 Tiggr
April 4, 2006 @ 5:07 am
A good thing is getting better!
Thank you very much!
#190 Anonymous
April 4, 2006 @ 5:53 am
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!
#191 Brian
April 4, 2006 @ 6:02 am
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.
#192 Lokesh
April 4, 2006 @ 8:21 am
#186, #188 Thanks for catching that bug so quickly. Its been fixed.
#193 Louis
April 4, 2006 @ 8:26 am
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.
#194 Jono | Iconaholic
April 4, 2006 @ 8:42 am
Great, thanks for fixing it so quickly :)
#195 Jonny Rocket
April 4, 2006 @ 9:56 am
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.
#196 Jonny Rocket
April 4, 2006 @ 10:19 am
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…
#197 MrSticks1982
April 4, 2006 @ 12:01 pm
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!
#198 Spook
April 4, 2006 @ 4:38 pm
Wow. Love it.
You are the best.
#199 Wiktor
April 4, 2006 @ 6:55 pm
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! :)
#200 Talguy
April 4, 2006 @ 7:20 pm
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
#201 nico
April 4, 2006 @ 7:31 pm
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?
#202 Paul
April 4, 2006 @ 9:31 pm
#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.
#203 Vincent
April 4, 2006 @ 11:19 pm
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?
#204 alan
April 5, 2006 @ 3:18 am
I was wondering, would this script be able to display a Flash file (swf) in a similar manner?
#205 Juan Pablo Reyes
April 5, 2006 @ 5:31 am
its' very coool!
i test this script in gallery1.
You can see it on my site here:
http://www.mundocarrete.com/fotos
Thanks.
#206 Thomas Mraz
April 5, 2006 @ 5:37 am
hi,
that is really great work! i installed lightbox2 within twenty minutes and it´s perfectly working!!!
THANK YOU FROM VIENNA/AUSTRIA!
#207 Olaf
April 5, 2006 @ 11:19 am
Hi,
this in scriptaculous.js works not when you XHTML as application/xhtml+xml give:
document.write('');
Have you a Fix?
#208 Olivier Ramonat
April 5, 2006 @ 11:32 am
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)
#209 Steve-0
April 5, 2006 @ 11:51 am
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…
#210 steve-0
April 5, 2006 @ 11:53 am
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.
#211 Steve-0
April 5, 2006 @ 12:43 pm
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.
:)
#212 Hans
April 5, 2006 @ 1:46 pm
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
#213 Vectormonkey
April 5, 2006 @ 5:10 pm
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
#214 Creighton
April 6, 2006 @ 1:36 am
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
#215 Roel krottje
April 6, 2006 @ 4:10 am
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
#216 Roel Krottje
April 6, 2006 @ 4:18 am
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
#217 Roel Krotte
April 6, 2006 @ 4:22 am
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
#218 RatSon
April 6, 2006 @ 4:58 am
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
#219 Tim
April 6, 2006 @ 6:15 am
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
#220 Allie
April 6, 2006 @ 6:29 am
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
#221 russell
April 6, 2006 @ 9:10 am
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…..
#222 Bradley Spitzer
April 6, 2006 @ 11:12 am
Hey, I just have to say that I LOVE Lightbox and that it has worked beautifully on my portfolio site.
http://www.bradleyspitzer.com
#223 Kinetic Mix
April 6, 2006 @ 11:51 am
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
#224 marc
April 6, 2006 @ 12:34 pm
great, awesome! thanks!
#225 Erby
April 6, 2006 @ 12:48 pm
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.
#226 Tim
April 6, 2006 @ 3:46 pm
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….
#227 Art
April 6, 2006 @ 4:04 pm
So easy, so fast, so elegant. You've made the web a better place! A+
#228 Will
April 6, 2006 @ 7:51 pm
I just updated to v2.02, its very nice thank you very much! you are amazing ;)
Will
www.willstumpf.com
#229 giles
April 7, 2006 @ 12:51 am
blog design is perfect. lightbox script a revelation. trying a mix with flickr. going for a sans flash nicholas grimshaw site. Thankyou.
#230 zwicky
April 7, 2006 @ 12:54 am
#223
Replace the following HTML tag in your page:
with
#231 Fuzzy
April 7, 2006 @ 1:10 am
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.
#232 Onizuka
April 7, 2006 @ 6:01 am
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)
#233 Robbie Done
April 7, 2006 @ 7:43 am
Great work, what a breath of fresh air this is!
#234 Simondo
April 7, 2006 @ 8:19 am
#230
Could you please either email that
#235 Simondo
April 7, 2006 @ 8:23 am
#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!!
#236 Phil
April 7, 2006 @ 9:23 am
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!!)
#237 Greg
April 7, 2006 @ 9:30 am
Flash support would be excellent
#238 bippym
April 7, 2006 @ 11:42 am
great script, i want to call it from flash too tho, the old version does it right?
#239 Bruce Gilbert
April 7, 2006 @ 1:06 pm
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…