I wrote a simple script for bloggers and other friendly folk to overlay images on their site called Lightbox JS. I’ve recieved lots of nice words and feedback, all of which is soaked up and appreciated.
I wrote a simple script for bloggers and other friendly folk to overlay images on their site called Lightbox JS. I’ve recieved lots of nice words and feedback, all of which is soaked up and appreciated.
Lex Jan 3rd, 2006
Lokesh, this is a really cool little script! Thank you.
John Jan 3rd, 2006
Hi Thanks ever so much for sharing this. It is awesome.
I was wondering first whether it was possible to get a message just below the image to let people know they have to click on the image to get back to the page. My mum just couldn’t figure it out, bless her. Good test though.
Otherwise I tested it in Opera and it gets stuck at the loading image and will not go forward to the larger image. Any clues on how to fix this. Tried it with Opera Version 7.54u2 (Build 3929).
Oh an Happy New Year, mine has started nicely thanks to you ;)
John
Lokesh Jan 3rd, 2006
John: If you downloaded the script before 12/31/05 grab it again. I have only tested in Opera 8.0 and it works a-okay there. Send an email if the problem persists.
Bharath Jan 4th, 2006
its not working for me :(
obharath.com/blog
John Jan 4th, 2006
Bharath, you’re pages take ages to load and looking at the code there are an incredible amount of javascript calls in just one page. There could be a conflict between scripts. Also your image is huge, why not try with a smaller image first. Also I haven’t tried with a text link, linking to the large image but like Lokesh a small image linking to a larger view of the image.
Jason Jan 4th, 2006
Lokesh,
WOW, pretty sweet. Really nice effect.
I am going to give it a shot.
Thanks for sharing.
Ian Jan 4th, 2006
Cool script its helped me out with my site by reducing the amount of code and getting rid of 1 page completely (i had a seperate image viewer) . Ill def put a link to this on my site somewhere when i get the new version up..
Johan Sundstr?m Jan 4th, 2006
Excellent in style and execution alike! Thanks for sharing this. (And compliments on a great site name too! :-)
John Jan 4th, 2006
Hi tried it in Opera 8.5 and it works fine
Must not work in the Opera version I had…
John
Tom Csizmadia Jan 5th, 2006
Hi,
Very clever stuff! :) Keep up the good work!
Tom from Hungary.
Kenny Jan 5th, 2006
Hi I tried it on my blog and had the same problem as Bharath – we both use K2 as our theme, so that’s why.
However if you go into K2 options under the WordPress admin panel, and just turn off Live Search, it will work flawlessly:
http://www.stereopoint.com
Thanks for sharing Lokesh.
Rene Jan 5th, 2006
Hi.
First of all I want to say that it`s the most awesome script i have see. ever.
but i`m having slight problems to get this shadow/overlay
working…maybe someone can help me out?
http://rene.srcom.info
(the newest post)
Andy Jan 5th, 2006
Dude, it’s so daymn cool!
I’ll put the link to it in my site when I’m done with the overhaul ;)
# Andy from the other part of the world
Yoav Jan 5th, 2006
Great script!
As per a suggestion above to have instructions to close, I added the following line in the javascript under:
objLink.setAttribute(‘href’,'#’);
//add title to image link with instructions
objLink.setAttribute(‘title’,'click to close and return to the gallery’);
you can check it out in action here:
http://www.redandwhitetoronto.com/gallery.php?year=2004
Thanks again!
AndrewE Jan 6th, 2006
This is the script I had been looking for since I can’t remember when! Thanks very much for sharing.
If you have a spare minute or two perhaps you could help me out, i’ve got it working on firefox but in IE the overlay.png isn’t showing, just the enlarged image.
Is this just a matter of IE or is there something I can do to make it work on both browsers?
my test site is here:
http://www.writerspace.net/o/
Thanks very much
AndrewE
Thomas Nesges Jan 6th, 2006
Very nice work! I just wrapped it to a Serendipity (http://www.s9y.org) Plugin, which makes using Lightbox JS in Serendipity just a few mouseclicks in it’s administration panel. The plugin should appear in S9Ys Pluginrepository in a few days. You can see it in action on http://www.soeldnerdesschattens.de
Lokesh Jan 6th, 2006
Rene – Your CSS style is looking for overlay.png in the directory the stylesheet is located in. Try updating the code to look in the root folder by adding a forward slash:
#overlay{ background-image: url(/overlay.png); }
AndrewE – You need to update a little snippet in your CSS file. Make sure that under the * html #overlay style, you are pointing to the overlay.png in the right directory.
Lynx Jan 6th, 2006
if images option in browser are set off – then page buggging!!!! “turn off” the browser :(
Chat Clussman Jan 6th, 2006
Excellent script. Thank you for sharing it with us.
I was going to make a feature request to either fade in the PNG or give some sort of indication that the image is loading but I see that Yoav already added a loading bar and tooltip, so I’ll just request that you roll those features into the next update. ;)
Chat Clussman Jan 6th, 2006
Ok, I’ll look before posting next time. I see the loading bar on the site you linked to. My confusion stemmed from it not being on this site (specifically your bike post).
Again, nice work and thank you.
kazi Jan 7th, 2006
like the script will use it in my blog!
Bas Jan 7th, 2006
Terrific script!
I’ve made a few additions to make it show captions and an optional link to the original Flickr-picture. You can see it in action on my weblog, together with a small explanation (only in Dutch, I’m affraid):
http://www.lovefool.nl/2006/01/07/lightbox-fotos/
Alexander MacCaw Jan 7th, 2006
Great Script!
I’ve made a few basic alterations using the script.aculo.us library. Just some fancy fade and drop outs. You can see it at:
http://www.ajaxcms.org/gallery.html
Thanks
AndrewE Jan 7th, 2006
Lokesh, many thanks for the tip. I’ll implement it a little later on.
Alexander MacCaw,
THos effects are nice, any chance of sharing the code at all?
Kirk Jan 8th, 2006
Very nice work. I suspect this will be very popular, I’m already thinking of ways to put it to work. Thanks for sharing!
Paul Jan 8th, 2006
Yep. V nice indeed mate. Ta for sharing. I can see this being used for defo.
fab Jan 8th, 2006
wow what a nice little code snipplet. i already used it and it works and looks fantastic. simply thank you!
John Jan 9th, 2006
This is a really elegant little idea. I can’t wait to have a mess with this.
Cheers.
http://www.flipflops.org/
Tonio Jan 9th, 2006
Great work !
Just got a problem, the overlay has just the size of the windows, and is on the top.
So if thumbnails are at the bottom of the page, the overlay background is too high to be visible.
Any idea ?
Anyway, that’s a great work.
Adam Jan 9th, 2006
wow this is great, this’ll finally be the perfect image implementation I’ve been looking for on my blog!
I was also using t he k2 theme for wordpress, is there anyway to get this to work with livesearch?
Peter Jan 9th, 2006
A very nice script ! But it have one slight delay: in Internet Explorer 5.2 for Macintosh it works quirky. The overlay image is not placed in tthe center of the window but the center of the image is placed in the right bottom corner of the window. The PNG isn’t placed at all but the animated gif is placed correct. Looks a bit strange … In all other browsers I tested it works great.
thewebguy Jan 9th, 2006
nice man, i really like this
Jon Jan 10th, 2006
Like the idea, but the overlay and loading gif don’t work for me — I wonder if it’s a compatibility issue with my browsers’ config (IE6, Firefox 1.5, both with Roboform and Onfolio).
Lokesh, I know you are inundated with support requests–talk about biting the hand that feeds!–but if you could have a look at http://www.squeakypig.com/misc/test/test.htm I would be grateful. For that matter if anyone could have a look and see if the overlay effect is working, I’d appreciate it. Cheers…
–Jon
Jon Jan 10th, 2006
Jon, you need to call the .css file as well for the “effects” to work. Put the lightbox.css and the two image files in the same directory and add :
in the head section of your html file and you should be good to go.
Lokesh, it might be worth including that info on your page about it as it took me a little bit to figure that out as well.
Jon Jan 10th, 2006
Ok, the comments didn’t let me add the code needed. See http://www.w3schools.com/css/css_howto.asp for instructions on how to have an external style sheet in your html if you’re not sure how to do it.
You need to reference the lightbox.css
nogg3r5 Jan 10th, 2006
hey,
ure a leged, that code is class, i might try and integrate it into a few projects im working on at the moment.
Nice one.
Noize Jan 10th, 2006
Wow this is a great script! keep up the good work :D
Imera Jan 10th, 2006
hi lokesh, very useful script u made. Not just good for blogs sites but for all kinds of sites! The downside is that some people have javascript turned off, but that’s a minority. Thank you!
Steve Jan 10th, 2006
As they say, “You the Man!”. Great script, wonderful effect. Thanks loads.
See at http://www.larimer.org/photos/
Imera Jan 10th, 2006
hi, it’s Imera again… I was thinking, if the script can accommodate some short text (eg. foto commentary) when the foto pops up, it’ll be even more wonderful. Just an idea! Great work, i’m very excited about it. :)
Lokesh Jan 10th, 2006
Bas – Nice work on the captions. I’ve recieved quite a few requests for this feature and will be implementing a similar solution later this evening.
Tonio – If the fullsize image increases the vertical height of the page, the overlay will not extend to match? I have an idea to fix this and will update shortly.
Adam – Load the lightbox.js before the livesearch.js and add this to the end of the livesearch.js file:
addLoadEvent(liveSearchInit);
Also, remove the body onload=”liveSearchInit”.
Peter – Sorry, no IE 5.2 Mac support. Upgrade!
empath Jan 10th, 2006
Very nice script.
Is there a way to force the images to be a certain size? I’d like to link to photo-gallery pics, but lots of them will take up the whole page and I don’t want that.
Nguyet Jan 10th, 2006
Thank you! this is awesome!
Mark Jan 10th, 2006
It looks great, doesn’t break ‘Open in new window’, and you’ve made it easy to incorporate into existing HTML. Impressive work!
Pete Jan 10th, 2006
Nice Blog and great script!
Here is a request, write a little script to do what they are doing here: http://www.36-degrees.co.uk/ Click Contact, it is also here: http://www.mooflex.net/ login in to the demo.
I love this ability to hide divs like this, would love if you could put a little resource together.
Thank you!
guy Jan 10th, 2006
very nice work, i might need to hirer your services in the future if possible.
Cyanbane Jan 10th, 2006
Great Hack. Thank you.
James Alexander Jan 10th, 2006
This is a great script, I can’t wait to use it on my new app (http://www.motoralley.com/bestdeals/)
npoz1 Jan 10th, 2006
I love this script even though I can’t get it to work. Can someone help me out. I’ve uploaded the javascript file, put the code in my header.php and used the appropriate code in my test post. Nothing happens though. Please take a look and tell me if you have any idea of what is going wrong. http://www.posnick.com/blog
Thanks
npoz1 Jan 10th, 2006
Nevermind, I just got it. I had uppercase letters in the url when there shouldn’t have been. Stupid on my part, but at least I eventually caught it. NOW I LOVE IT!
anhinga Jan 10th, 2006
I love love love this script. One suggestion: after the main page is loaded, why not start preloading the larger images? Would make the experience even smoother.
thanks so much!
a
Spart Jan 10th, 2006
Wow, this is so impressive. Great idea, great execution. Thanks for sharing.
Skwid Jan 10th, 2006
This is great – would it be possible to do the same thing for a div ? I am thinking of a login popup. Please give me feedback.
Manon from NYC Jan 10th, 2006
O man, you rock! I’ve been looking for something like this, something simple, beautiful and elegant for all those site galleries I have to create. I’d love to leave a credit for you on the sites I design that use Lightbox. What should I use as your credit? And once again, this girl thanks you from the bottom of her designer heart.
Bane Jan 10th, 2006
Fantastic idea, just what I needed. I solved the problem of a close via click comment by adding a background image with that text aligned to the bottom right on the overlay.
Modify CSS:
#lightbox {
background: #eee;
To:
#lightbox {
background: #eee url(close.gif) no-repeat bottom right;
and make an image to match.
http://www.banemacleod.com/lab/flickr/
Adam Jan 10th, 2006
Thanks Lokesh, works beautifully now with livesearch!
DArren Jan 10th, 2006
Sweet piece of code and design. I love it and will be using it.
jon Jan 10th, 2006
Hey Lokesh, great script. I’m having the same problem: the overlay doesn’t fill the screen, but just creates a little 2px border around the picture. The picture is only 30px by 30px so I don’t think it increases the page height. Any ideas?
pHaez Jan 10th, 2006
It appears in firefox that the javascript is not getting the proper page height to make the overlay cover the whole page. Even on your example page, there is a small bar at the bottom of the page that is not covered with the overlay. On my site, the bar is quite a bit bigger, It doesn’t appear to have anything to do with the fullsize image, as my fullsize image is smaller than the one on your demo page, yet my bar of missing overlay is larger.
David Jan 10th, 2006
Nice script =) very useful!
Daniel Jan 10th, 2006
Lokesh,
Thanks so much for sharing, so folks like me can look great without having work out all the details. I’m adding this to my picture gallery that I’ve already put together. Smart work, and even better that you’ve set it up to degrade if someone doesn’t have js enabled.
Gregory Kerstine Jan 10th, 2006
Script works fine. Except that flash embedded files still overlap the popup image. frustr8.com/event-2-11.htm. Thank you!
wjb Jan 10th, 2006
Hey cool script, thank you! Anyone know how to get rid of the link border color around the loading gif when it pops up? A CSS rule or somthing? It only has a border around it in IE, not FF. TIA
cr4z3d Jan 10th, 2006
Awesome script! Wondering if you maybe got my email? I’m the one having problems with the overlay not covering the entire page when using PHP to load all my images.
http://stinkyangelo.net/thearchive/gallery/
David Jan 10th, 2006
Simply genius.
Kevin Jan 10th, 2006
This is awesome! Dugg it this morning, now I’m putting it in to practice.
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
THANKS
pHaez Jan 10th, 2006
my solution to the overlay not covering the whole page (namely in firefox) was to change:
if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac…would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
to:
if (window.innerHeight && window.scrollMaxY) {
xScroll = document.body.scrollWidth;
yScroll = window.innerHeight + window.scrollMaxY;
} else if (document.body.scrollHeight > document.body.offsetHeight){ // all but Explorer Mac
xScroll = document.body.scrollWidth;
yScroll = document.body.scrollHeight;
} else { // Explorer Mac…would also work in Explorer 6 Strict, Mozilla and Safari
xScroll = document.body.offsetWidth;
yScroll = document.body.offsetHeight;
}
Ben Schwarz Jan 10th, 2006
Nice effect.
Might be a little nicer if the image was attached with absolute positioning so as when the browser window is resized its centred.
Leonardo Jan 10th, 2006
Excellent work, this is a revolution for those who want to do not use pop up and want to open an image in full size, congratulations.
G?bor Jan 10th, 2006
It would be useful in the future versions if the big image would inherit all the attributes (title, alt, class, etc.) of the thumbnail picture. I suggest using relative z-indexes to a variable’s value for the layers.
Adam Jan 10th, 2006
Outstanding work. I incorporated support for this on my forum software, and it works great so far.
echoniner Jan 10th, 2006
THANKS A MILLION! beatutiful script!
im still in the process of manipulating it just a little to make it work on a project of mine, but feel free to check it out: http://www.echoniner.com/woolgathering
you’re the best!
FrontPage Sucks Jan 10th, 2006
How would you add the code in Frontpage 2003?
ryan Jan 10th, 2006
Very cool, nice work.
Mads Jensen Jan 10th, 2006
VERY nice work…
THANKS
pete Jan 10th, 2006
really nice, thanks.
Lokesh Jan 10th, 2006
wjb – To remove the link border color, add this to your stylesheet: a img{ border: none;}
pHaez – I’ve also noticed sporadic issues with FF not covering the complete height. I’ll have the script updated shortly.
G?bor – The update mentioned above will also include some accessiblity changes that will allow the big image to carry over the title and alt attributes. Check back tomorrow.
Anyone who hasn’t received an email reply, hang tight! I’m getting to yours next. : )
AsceticMonk Jan 10th, 2006
Thanks Lokesh for this magical script, I truly enjoyed the effect.
Just finished implementing it on my blog: http://www.asceticmonk.com
Drew slifer Jan 10th, 2006
Wow, your site was even put up on DIGG and you your server still stayed alive!
I love the lightbox, and your site is amazing! I’ll definately be sure to check in a lot more often :D
Chris Jan 10th, 2006
Excellent script. Very useful and stylish!
Ross Poulton Jan 10th, 2006
Excellent work!! I’ll be implementing it in a gallery app that I’m working on in Django.
Wayne Jan 10th, 2006
i used the script. looks great. thx.
http://www.redipixel.com/artwork.php
Matthew Jan 11th, 2006
thanks for writing this script, im making a school presentation on the web and i think it will help give me the edge i’ve been looking for.
GaBuBu Jan 11th, 2006
Useful when u are not using sIFR in the webpage.
Bas Jan 11th, 2006
GaBuBu: It does work with sIFR, only you have to tweak it al little to make the onload-event work. In the end, I just put this code in my header:
<body onload="sIFR_now(); initLightbox();">Eoghan McCabe Jan 11th, 2006
What a fantastic idea!
Drew Jan 11th, 2006
Superb script. got the update for the floating captions (ala alt text) but is there a way to have text in the popup window say on the bottom. The popup caption can only hold so much info.
Eoghan O'Brien Jan 11th, 2006
Excellent script, very kind to share this, you’ll probably see it all over the web now though. I cant wait for some more features to be added. I’d like to see some more transitional effects, as long as file size stays small. Thanks Again.
HeadY Jan 11th, 2006
Really nice Script and nice Idea…
BUT:
I tested it with my mom, and said “look at the Bikes”. She clicked the fist picture, and i said “look at the next one” and what did she do? Clicked the BACK Button on her mouse. :(
So nothing to use on a normal site. The normal internet user seem to be confused with it. :(
Kevin Jan 11th, 2006
Okay, I’m having a problem with IE. I have a dropdown form that is in the same area as the pop-up image and the form box is showing up on top of the image. This is only happening in IE, not FF.
Example:
http://www.transmatrix.net/cgi-bin/photoeditor.cgi?ID=1
Jon Jan 11th, 2006
Thanks so much to the “other” Jon (posts #34, 35)…what a rookie mistake on my part to have left off the CSS link. Thanks for your help!
johan Jan 12th, 2006
absolutly brilliant !!!
this is one step forward in webdesign.
thanks Lokesh for sharing this with us and for the hours spend
on this project.
BOK Jan 12th, 2006
This is a great feature on any page to show some images. Thanks!
But somehow the title-text is not showing up on my blog: http://bok.xs4all.nl/weblog/
Fancytooltips is in the way… http://www.victr.lm85.com/fancytooltips/
manuel Jan 12th, 2006
woot! who needs image gallery scripts anymore? ;-)
PLEASE:
it would be very kind of you coding guys
if someone could tell me how do i add a second line
below the images title that sez something like
“Click Image to close” in bold/strong letters.
i tried to do that manually in the title=”blah” of the href,
but that is not working for me because wordpress
removes the closing and tags.
so how do we do this in the javascript?
or maybe even how do we add a tiny “X” grafic
that closes the lightbox? maybe in the top right (win)
or top left (mac) corner…
your help will be very appreciated! :)
manuel from the frisian islands
Jul Jan 12th, 2006
Amazing script!
But one question. In preview, after loading my image, the loading image doesn’t dissapear, so If my image is too small I can see the part of the loading image. How it could be fixed?
Thanks!
Ray Jan 12th, 2006
Very useful script, thanks for sharing!
Xavez Jan 12th, 2006
Oi mate, love the script, now using it on http://www.xooz.be and I’ve gotta hand it to ya: it just looks GREAT. Why didn’t I come up with this myself, darnit!
Lokesh Jan 12th, 2006
HeadY, manuel – I am working on adding a small ‘X’ or graphic on mouseover. The script should be updated for tomorrow.
Jul – “after loading my image, the loading image doesn?t dissapear.” I’ve just recently updated the script to fix this.
Jul Jan 12th, 2006
Thanks a lot, Lokesh!
By the way, on my browser(IE6) width doesn’t overlayed for whole size (on Firefox it’s ok), so I added into showLightbox() function, next row:
objOverlay.style.width = (arrayPageSize[0] + ‘px’);
and it fixed the problem.
Leandro Jan 12th, 2006
Excellent work!
I?m testing the update and waiting for that full gallery thing.
By the way, could Alexander MacCaw show us the script under the fancy stuff in http://www.ajaxcms.org/gallery.html ? The drop outs feel fine. I want that! ;)
johan Jan 13th, 2006
#97
Hi leandro
you should visit http://wiki.script.aculo.us/
there you can find the effects you want.
read instructions to install javascripts -> very simple
in code you only have to change the following
line 188 //objLightbox.style.display = ‘block’;
new Effect.Appear(objLightbox);
line212 //objLightbox.style.display = ‘none’;
new Effect.DropOut(objLightbox);
you can see it in action on http://new.909.be/portfolio/1/
all kind of effects can be added.
Frank from Berlin Jan 13th, 2006
To prevent moms and other ungeeky people from running into the usability trap of having to click the image to close it –
Add this line:
objOverlay.onclick = function () {hideLightbox(); return false;}
right below that line:
objOverlay.style.width = ‘100%’;
This is expecially important because in the people who are most likely to be confused are also most likely to use IE – at least in my IE6 the semitransparent background won’t work
Xavez Jan 14th, 2006
The overlay works fine in IE here… Are you sure you added the CSS code the right way? :)
Frank from Berlin Jan 14th, 2006
Uuuuhm – shame on me, of course the overlay works in IE :-) I guess I indeed need to fix my CSS.
But still: I recommend to everyone to consider using the line I added in posting #98. Yes, I know more about usability than I know about CSS :-)
ryan Jan 14th, 2006
Hi – I’m using the Wordpress K2 theme with this (awesome script!). After reading your commets, I was able to get this to play nice with livesearch.js (see comment #41) but I noticed another ‘conflict’. When I go to a permalinked page, two other .js files are loaded, one of which is ajax_comments.js. If this is on, the lightbox will not work. When I turn ajax_comments off, lightbox works again. If there a way to get lightbox to play nice with ajax comments?
Thanks for any help with that!
Also, Alex McCaw – nice work adding some neat effects.
henry from germany Jan 15th, 2006
hey!
this is great and beautiful stuff – thanks for this!
henry
Nick Fessel Jan 15th, 2006
Lokesh,
Thanks for fixing the IE6 bugs. The IE6 problem was the only reason I didn’t use this the first time. I came back to see if it was fixed and I am happily surprised. Great job.
Nick
Rick Jan 16th, 2006
Please help,
It works on safari but I cant get it to work on firefox 1.5 on a mac. Please let me know what I am doing wrong:
http://flighthousetravel.com/test/
Monika Jan 16th, 2006
Hi great idea!
I’ve tested your script without using a mouse.
I can’t use ist, if I’m an internet user who can use a mouse.
And is there a fallback solution for user who are surfing without js?
kindly regards.
Monika
Ingwa Jan 16th, 2006
This is a really great script and I have had quite a bit of fun playing around with the background, image box background and close buttons.
However, just a small thing, it would be great if we could position the box absolutely (i.e. 20 px from the top of the scrollable area). Can this be done?
Thanks for your work and look forward to a reply (by email if possible :) Great Work!!!
Ingwa
MoeJoe Jan 16th, 2006
Great Script. is there a way to open the popup when the small images are in an imagemap?
Ben Jan 16th, 2006
Great script. I love it.
What would be even greater is if it also had a next and previous button!
Chris Jan 16th, 2006
re. Monika’s problem, its not that it can’t be used without a mouse, just that it could take a while to move focus to the close button.
These two additions will give the lightbox close link focus – meaning enter can be used to close it.
at ~#200 (after setting display:block on obj.Lightbox and before return false)
document.getElementById(‘lightbox_close’).focus();
at ~#320 (after creation of objLink)
objLink.setAttribute(‘id’,'lightbox_close’);
Markus Jan 17th, 2006
Hey, that’s really great! Thank you for this nice feature!
MARKUS
Odair Jan 17th, 2006
Hi, i’m from cape vert and i found this Lightbox JS a really nice script. God job Lokesh!
Now it will be easier for me to make my photo-galleries.
OP
Dave Weeks Jan 17th, 2006
Cool!
A very nice script. Thank you from Frogtails.
mazdac Jan 18th, 2006
Great script! Thanks for it!
Dominic Jan 18th, 2006
This is a great script I was looking for for ages, since I hate pop-ups so much.
Sharing your work is very appreciated, thanks!
Lokesh Jan 19th, 2006
#109, #113 Monika & Chris
I’ve just finished adding a keypress action for closing the Lightbox.
Dave Jan 20th, 2006
Lokesh,
Great script! Everything is working fine for me except one thing. I use the “float” attribute inside a table to space out and stack the thumbnails of my images. If there are a lot of images on a page and I click on one of them before it loads all the thumbs, then the script is never called and the linked image simply appears in a new, normal browser window.
Any clues here so that the script works even tho all the thumbs aren’t loaded?
Thanks for any help!
Dave
Ray Jan 22nd, 2006
Brilliant!
A problem with Firefox is the default setting is to open pop up windows full size. Now it doesn’t matter what settings or what browsers my visitors use.
This has made my site more professional.
http://www.gdaywa.com/extras/hol/hol.php
stilfx Jan 25th, 2006
Excellent Script!!!!
But, I’ll second the notion – is there a way to trigger the script from an image map since rel=”lightbox” wont work in the tag?
Scott Jan 26th, 2006
Any one care to share a link where Lightbox is being used with sifr? I saw it mentioned in comments 84 and 85, but no link was given.
kevin Jan 27th, 2006
Great but….
IE reloads the full image every click, firefox is instant after cache. tested on several PCs?
ND Jan 27th, 2006
Can anyone help?
I amusing large images with my lightbox script. Does anyone know a way to program this so when you click onto the larger image to return to the thumbnail, it goes ?exactly? where you originally clicked the thumbnail.
This allows for easier navigation. Any help would be apprecitated.
Jason Gegere Jan 30th, 2006
Great script!
LS Feb 2nd, 2006
wow, what a great script indeed!
but im having some problems with the preloader, and the litle ‘x’ gif on the corner…they dont show up…i dont know why! ive uploaded all the files to the server, but still nothing…am i supposed to change somehting in the .js file? if so, how?
any help would be appreciated.!
Benek Feb 4th, 2006
Awesome script man!
It’s too bad browsers like to put flash on top of everything else, because I’d love to use this on pages with flash elements. However, no problem, I created a page minus the flash for use with this.
But there’s another problem for me! Works great in Moz, but in IE 6 the background png doesn’t show up at all. I’m susing your exact CSS code with no modifications to the background part. Any ideas what could be causing this?
Here’s the link: http://lisefski.com/blank-cali-01-06.html
SoulCreeper Feb 7th, 2006
i just want to say that this script is really awesome. i cant wait to see it working on my own site soon :P
just a question. when i tried to seperate all the files into folders, i.e. the .js file in a ‘js’ directory, the css file in a ‘css’ directory and the images in a seperate ‘images’ directory, the overlay doesnt seem to work. or is it just that i am testing the thing offline?
Donnerschlag Feb 7th, 2006
I love this script a lot. I am going to be using it in my World of Warcraft site but was woundering if there is a way to customize it. What I wanted to do was to have it pull up images or another page, more php then html. So when they click on a members name it brings up a small div with their info and a few images and some php includes. Also do a random effect like the drop out or fade out. Is tere a way to do this?
Thanks in advanced and thanks for letting everyone use LightBox.
Anathema Feb 9th, 2006
Could this be altered to display movies, or any other media, instead of images? I mean there is no reason why you couldn’t insert the appropriate embed or object tags to do this right? Javascript makes me retarded so I have no idea where to start.
Caleb Hale Feb 9th, 2006
The script is great, clean, simple and looks fantastic.
Keep up the great work :)
wanted Feb 10th, 2006
Very very good script. ;)
I would to use the script in my php gallery but my images link are not in standard format (Ex. img/temp.jpg). All images are generated dynamically by php script (Ex. album.php?id=12) and the Lightbox script don’t work.
Do you have any suggestion for me? Tks :)
ND Feb 10th, 2006
Has anyone been able to extend the dark background on IE? If the page of images causes a scrollbar to appear, and if I scroll down, and click on a picture, the dark background doesn?t fill all the way. It was fixed in FF, but the problem still exists. Does any smart person out there know how to fix it?
martyn Feb 12th, 2006
I’m getting this:
Method Not Allowed
The requested method POST is not allowed for the URL /lightbox/text.html.
Any ideas?? It’s meant to work like this:
http://particletree.com/examples/lightbox/
I uploaded everything I had too, it works on the comp but not on the server. Please advise.
Martyn
Anonymous Feb 12th, 2006
whoops
^^^^^^
http://www.apachestudios.com/lightbox/
Lokesh Feb 12th, 2006
#131 Anathema – Check out the ‘Lightbox Gone Wild‘ modifcation.
#134 ND – I’ve noted the bug when the image extends the page in IE and the overlay doesn’t extend accordingly. Looking into it.
#135 Martyn – About the Lightbox Gone Wild script, I would recommend you get in touch with the author of that article with your question.
ND Feb 12th, 2006
Thank you Lokesh. I know a lot of us throw bugs to you, but it is only because it is an awesome script, and we want it to work perfectly. Thanks for looking into it.
chrisbears Feb 17th, 2006
Hi!
Did anyone try this script with an animated GIF? I got some funny reactions in IE 6 for it will open the picture again and again and again and again…
It works fine with normal GIFs (IE and FF).
Any ideas?
Great script anyway, thanks!
chris
chuckp Feb 18th, 2006
Playing around with your script, it’s really cool. However, I have Flash files on the site and they stay on top, even if I add a z-index call to the css file. Is there a workaround for that, it defeats the whole purpose of your script if someone else is on top of it? let me know, i’d love to use this.
Jarmo Feb 19th, 2006
This is a very cool script! however, there’s a minor problem with the layout. If there is not a vertical scrollbar on the page, it will appear when you click the thumbnail. This causes a horizontally centered page to move a bit – but enough to disturb – to the left. Then when you click the image to close it, the page moves back to the original place (and vertical scrollbar disappears).
now, what i’d like to have, would be a fix that would prevent scrollbar from appearing and messing with the centering. So no scrollbars what so ever if the picture fits the screen anyway. It must be becouse of calculating the dead center point with JS but is there a workaround for this?
chucks Feb 19th, 2006
Great script! Love the recent updates to it, as well.
Deployed on this site:
http://willseberger.com/
Using it for numerous photo portfolio pages.
I’m also playing with the update to this script found here:
http://www.alwaysbeta.com/2006/02/08/building-ab-customizing-lightbox/
I like that this can be integrated with Moo.FX.
mllebuffalo Feb 20th, 2006
lokesh,
everyone is so thankful for your genius + generosity!!! this is a fantastic script (we all concur :))
quick q: if i want a lightbox when my page loads, do i just call the javascript in the body tag? ??
a big fat TY
technosinner Feb 20th, 2006
Oh-my-GOD! I’m panting like a little girl!!!
You are a [insert hyperbolic expression] genious!!!
Thank you so much for this… I will now go worship you as an Idol… ;)
Ryan Feb 21st, 2006
I tried using that script and I can’t seem to get it to work within my page. I can make simple ones and get them to work but once I try to add the script to my page is doesn’t work. I cleaned up my styles like someone mentioned but that still didn’t work. What could I be doing wrong? Thank you for any help.
-Ryan
here is the page:
http://glorydayssportspub.com/photos2.html
thanks again.
Theron Feb 22nd, 2006
Love the script. Solves so many pronlems! I have used it a lot and clients and user alike love it.
I did run into a problem with IE6 however. The overlay loads briefly, but then the page redirects to a new page and just displays the image. the url of this page is the image path. I’m puzzling through the js file, but would love any input from the group here.
Lokesh Feb 23rd, 2006
#127 LS – can you point me to a url
#128 Benek – Find the ‘* html #overlay’ selector and jump to the ‘filter:’ line in your CSS. This line makes reference to the overlay.png and is looking for the file relative to the html page, unlike other graphics referenced in a css file that look for the file relative to the CSS file. Hopefully that makes sense.
#130 Donnerschlag – The Lightbox JS script serves a very specific function. For what you’d like to do, the Particle Tree modification might work.
#145 Ryan & #146 Theron – Check the tag for an onload=”…” attribute. If it exists, append it as so ;initLightbox();“>.
Liteoni Feb 23rd, 2006
Can I use this in a commercial web page? I would modificate it a little bit. It’s a web page for a friend. He is self-employed. It’s not a big company or anything.
Jarmo Feb 23rd, 2006
I found out that the problem I described earlier (#141) doesn’t appear with opera. Firefox and IE seem to have problems. Another bug I found: There’s an issue with the very first time you’re using the script. This bug also happens with IE and FF, not with opera.
the first load with IE (6) causes the loading-gif to appear in middle-top instead of dead center position. So the loading animation just runs above the picture all the time.
the first load with FF (at least 1.5.0.1) doesn’t use the script at all! after the first time you use the script it works as it should. so if you go to my page
http://www.jarmovalmari.com/gallery.php
and click a thumbnail. it goes to a new window window (as I have defined in a href tag).
IE6 also creates a vertical scrollbar some scrollable – which should not be needed since the picture already fits the screen.
James Edel Feb 25th, 2006
Is there any way for the images to reference the script before the page is loaded?
I have a lot of images on one page that can take awhile to load, and if you don’t wait for them all to finish the image link pops up in a new window.
Anybody know a way around this?
Thanks
AWESOME script BTW!
Jake Feb 28th, 2006
Lokesh, I emailed you yesterday about a problem I was having with Lightbox in IE 5. Well I found a way to fix it, but I don’t know why it works.
In IE 5 the image frame went all the way to the right edge of the browser window. Adding a rule to the css fixed it:
* html #lightbox {
width: 1px;
}
In my tests, any width value solved the issue. Hope this helps!
Emmanuel Okorie Mar 1st, 2006
Thanks for such a superb script. Was looking for something to replace the design I was using on my website and this came in handy. I am using it to pull images from a MySQL database and it seems to be doing the job very well indeed :)
http://www.grafikkaos.co.uk
Thanks
rob Mar 2nd, 2006
hmmm, could you help out with my script, i think i did it by the book but not getting the functionality (ignore enlarge image button)
http://www.englishtrunkshowco.com/category.cfm/categoryoid=1
thank you,
rob
Mike Mar 3rd, 2006
I have no problem running the script with asp… but not working with coldfusion MX 7 when the page has a form !
To Rob #153 Mar 4th, 2006
I have had a look at your site… where are the images exactly?
rob finn Mar 5th, 2006
hi thanks for helping, the imags are with the js and css files in englishtrunkshowco/css
tenaciouspingu Mar 5th, 2006
really nice, i finally just got it to work in both internet explorer and firefox, sweet.
Emmanuel Okorie Mar 6th, 2006
Hi Rob,
I would need access to your main filesif i am to see where you are going wrong with the lightbox script.
email me at emmanuelokorie[at]hotmail.com
Anonymous Mar 8th, 2006
Thanks for a good script!!
David Mar 9th, 2006
Could someone be kind and tell me the line of code that tells it not to unload when the user clicks outside of the image box (a.k.a. the greyed out area)? I just want to be able to unload the box if the user clicks the “x” or the image itself (which it does that now).
Only thing i could find that may be it was the:
objOverlay.style.display = ‘block’;
in the function showLightbox(objLink) call… however that did not work.
Thanks for your help,
David
xsism Mar 9th, 2006
I thought IE doesn’t support Alpha Transparency in PNGs? It appears to work though in Opera, FF, and IE. Did I miss something, because i’ve been using straight CSS alpha(even though it doesn’t work in Opera).
xsism Mar 9th, 2006
nvm, i figured out the CSS hack in your code, but what does the ‘* html’ mean in CSS?
Brian Allen Mar 10th, 2006
I would suggest the addition of a pre-caching trict to get the big image to load.
Something simple like :
This way your script will just pop the larger image on the screen.
- Brian Allen
My Home
Lokesh Mar 11th, 2006
#148 Liteoni – The script is free for use in personal and commercial projects. Just leave my name and link. Thanks.
#151 Jake – Thanks for the IE5 fix.
#160 David – If you don’t want the lightbox to dissapear when the user clicks outside of the image, remove this line:
objOverlay.onclick = function () {hideLightbox(); return false;}
#161 xsism – IE supports alpha transparency in pngs but needs to be turned on manually. Take a look at the lightbox css to see how.
tranquiliste Mar 11th, 2006
Hello Great scritp I am going to use it for my Photo gallery and I implemented it in to my blog (http://tranquiliste.free.fr (look at the pic of the watch).
But I have a dumb question : how to increase or decrease opacity of the background?
Thnaks again
David Mar 12th, 2006
164 Lokesh: Thank you, i got it working now.
I have another question though.. what was the code for hiding the select boxes on a form before the image is displayed?
Thanks again.
David
David Mar 12th, 2006
Op, well i just found it :o)
Thanks anyways,
David
Jago Illustration Mar 14th, 2006
Hi,
Just thought I’d leave a thank you not. I’ve just re-built my site and used Lightbox for all my portfolio pages, it’s fantastic. I’ve linked to you on my Links page and on my blog, great work…
Jago
http://www.jagoillustration.com/
http://jagoillustration.blogspot.com
Jen Mar 14th, 2006
Hey Lokesh, beautiful piece of work. I’m having one problem with it though… Actually I’m using Lightbox Plus for wordpress, so maybe I’m barking up the wrong tree here. Anyway, I’ll give it a shot. When I go to validate my page (I’m using XHTML Transitional 1.0) I get 5 errors. It seems the script is automatically adding rel=lightbox to my anchors AND to my images. When it adds it to the image, it adds it after the ending slash:
Like this:
border=”0″ / rel=”lightbox”>
Is this something I’m doing wrong or is it something in the “Plus” plugin for Wordpress that is breaking?
Thanks again and any help would be appreciated!
http://www.popstalin.com/blog/?page_id=2
AJ Mar 15th, 2006
I don’t know if anyone has posted about this or had this issue….but. I am using some flash on my site…and whenever anyone clicks on an image and the overlay.png is layed down and the image is displayed…the flash disappears. Anyway around this?
mox Mar 16th, 2006
Wow, Incredible work !
I’m planning to use it in my new gallery that I am developping.
One thing.. When the page is not completely loaded and someone click on an image it’s loading in a blank window. Is there a way to make your script “intrusive” ? eg: … ?
Thanks !
–Ben
Samuel Mar 19th, 2006
Thanks a lot, this is really cool script.
Aymeric Mar 19th, 2006
Hi, very nice script !
I wanted to know how the lightbox can be openned clicking an image map.
is there any possibility ? inserting a “rel” in the AREA tag ?
I tried anything lol
Thx
Aymeric Mar 19th, 2006
Sorry, i didn’t try anything because finally, i found it !
:)
Thanks again
Evan Mar 24th, 2006
the script appears fine in Firefox
but when I open the page in IE it doesnt work. Can you tell me why. Heres a
link to the page.
http://www.hawkhillrt.com/images/Nocturnal/wayne.html
tg Mar 24th, 2006
Evan,
Works for me when I cut out everything from object to /object. And I don’t even have flash installed.
Tony Mar 24th, 2006
Works very nicely indeedy. Same question about absolute positioning as Ben Shwartz #68, to have the image centred at various screen resolutions. Any fix for this?
thanks very much
Evan Mar 25th, 2006
Yea that doesnt make any sense to me. Also wouldnt that cause it not to work in firefox then? can u copy and paste what should be taken out.?
erik Apr 9th, 2006
its great!
Evan Apr 17th, 2006
Still cant get this to owrk in IE. Any helo will be great. Or if some one can just copy and paste the code in here that needs o be editted,
Ollebulle Apr 26th, 2006
Thanks for this awsome script. I have one question though.
I need to “unescape” the image/image path “var” that lightbox.js gets from the “a href” in the html/php file.
Can someone help me or point me in a direction please, js isn’t really my cup of tee.
BlueCat May 1st, 2006
Hi all: I’m a total noob when it comes to using scripts and etc on my website but I’d really love to use this cool LightBox, *except* I don’t wanna have it “dim” the page before popping up the image in the nice white-square picture frame: I just want the picture to pop up when the thumbnail is clicked.
Can anyone tell me what parts of the JS file (and other files?) to delete to make it work that way? Thanks in advance if so :)
BlueCat May 1st, 2006
P.S. Oh yeah, forgot to mention since I just want this more *simple* as noted above, I wanna use just the older LightBoxJS and not the more fancy (and complex) 2.x version which Lokesh has posted recently.
Any help? Anyone, anyone? Bueller…? Bueller…? ;-)
Thanx
Osvaldo May 4th, 2006
Hi All,
I got the script working but the image it shows is cut a bit on the right side I don’t know why. Can someone help?
Here is a link of how it is showing:
http://www.maningue.com/2006/04/29/como-o-bode-foi-la-parar/
great script btw.
Kelly May 5th, 2006
It’s my first visit to your website. After just a quick browse, I’m really impressed!
buy phentermine | carisoprodol | phentermine online |
Kevin Shen May 5th, 2006
Your site is very cognitive. I think you will have good future.:)
[URL=http://s3.phpbbforfree.com/forums/index.php?mforum=kkarsha]adipex[/URL] [URL=http://vvarder.cba.pl/adipex.html]adipex[/URL] [URL=http://vvarder.cba.pl/alprazolam.html]alprazolam[/URL]
Monika May 5th, 2006
Hello admin, nice site you have!
ambien http://vvarder.cba.pl/ambien.html hydrocodone http://partizzanka.cba.pl/hydrocodone.html lorazepam http://partizzanka.cba.pl/lorazepam.html
Michael May 5th, 2006
Best site I see. Thanks.
Michael May 5th, 2006
Best site I see. Thanks.
[URL=http://s3.phpbbforfree.com/forums/index.php?mforum=kkarsha]adipex[/URL] [URL=http://vvarder.cba.pl/adipex.html]adipex[/URL] [URL=http://vvarder.cba.pl/alprazolam.html]alprazolam[/URL]
Eugene May 5th, 2006
Your site is very cognitive. I think you will have good future.:)
ambien http://vvarder.cba.pl/ambien.html hydrocodone http://partizzanka.cba.pl/hydrocodone.html lorazepam http://partizzanka.cba.pl/lorazepam.html
Ann May 5th, 2006
Very good site. Thanks for author!
Donnie Jun 6th, 2006
Lokesh thank you very much for the script. I am using it on many of my web sites now for both personal and work. I also am experimenting with adapting it to the web version of a comic I am working on at http://www.StarForce7.com. It would be interesting to see how I can incorporate web audio into that somehow maybe on the image calls to trigger sounds. :)
Again thanks very much for your script – nice work!
–Donnie
Heather Jun 9th, 2006
Hi…I would appreciate anyone who could help me. I am new to this. But I love this script. I’m not sure where to put the “Close.gif” and the “Loading.gif” in my script. I have both images in the same directory as all the other files. Dynamic Drive say to put the following variable inside of the js.file. How on earth do I do that? This is my script so far.
So where would I add the below in the script above? Thanks all..
var loadingImage = ‘http://heatherpatterson1.tripod.com/loading.gif’; //path to the “loading animation” image
var closeButton = ‘http://heatherpatterson1.tripod.com/close.gif’; //path to the “close” button image
Chad Jun 19th, 2006
I was wondering why every time I click on an image in a site using lightbox I am left with a flashing cursor? This is even more confusing when some computers don’t do this but others do. I have tried to view the site I am helping with on six different computers and 3 leave a cursor and 3 are normal…??? http://www.akclimber.com Any help you can give would be greatly appreciated.
Chad
?? Jun 26th, 2006
hello
Lynda Jul 1st, 2006
Hi Lokesh
I’ve recently designed a website as part of my Masters Degree and I have used your Lightbox Js to display images of hardware devices etc. I think they work really well and look great. My lecturer had never heard of them and so you made me look really good – thanks!!!
Keep designing
Lynda
:-)
you can check it out if you like:
http://www.newman.ac.uk/Students_Websites/%7El.frisby/index.htm
Great ! Thanx Jul 10th, 2006
I’m using it for my shop with oscommerce, smashing !!
The (future) shop :
http://www.locace.com/active/catalog/
(By the way I didn’t manage to install the Advanced Pop-up Image v1.0, but nevermind the lightbox JS does the job very well)
Cave Jul 24th, 2006
I love the script, it’s amazing, and so well thought out. Absolutely perfect. But, of course, I ran into a serious problem that’s keeping me from using it at all at the moment. I’m working on a site that reads/scrolls to the right, and extends pretty far, and any time a photo is launched, it only affects the very left of the site. Here’s a rough sketch(please ignore the name/logo-just a place holder!): http://www.luthian.org/photo/
Again, amazing script! I really hope I can get this going on the center of the click target.
jirjen?! Jul 27th, 2006
Hi Lokesh!
Great plug-in, thanks for sharing it! I really like it using it at my weblog jirjen.de.
But -sadly- it doesn’t work with my other homepage http://www.pimpmybride.at
That wordpress-based homepage is using the theme Blue Kino 1.1. Usind other themes it will work, but we spend a lot of time adpating the Blue Kino for our wedding homepage.
Does somebody have a clue?
Thanks so much!
palik Aug 1st, 2006
great script. i use lightbox v1 because i dont need nothing more… maybe you could put in the troubleshooting section my case: i have some js generating views for small city map with points, so when i click on district i do clear my points, load new image with district map, and make new points/links… my case is that i have to init lightbox every time after i click on district rather than init it on bodyload… it is because when my body loads there are no links yet, only after visitor clicks on district links get spawned by js, and THEN i use initlightbox();… ughh… its complicated, right? so see it on http://www.samobadanie.vel.pl
phillip Aug 12th, 2006
Love you script! How do you add an email link to a person’s name?
Example:
Thanks I appreciate any input…I’m still a newbie.
Kim Aug 22nd, 2006
hello! love the script!
i just have problem implementing the lightbox 1.0, its about the overlay in IE. i’ve checked all the posts and everything is about pointing to the right directory right? well i did that, even used an absolute url to try to get the exact locationgbut it doesnt work. i even copied the overlay to the same folder so i could use “overlay.png” instead of “/images/overlay.png” or “../images/overlay.png”, but it still doesn’t want to work in IE.
what am i doing wrong??
thanks!
Matt K. Aug 23rd, 2006
Vey nice script! thanks. Sily Question perhaps–in order to get this working, do I have to actally input rel=”lightbox” before each picture to get it to work or is there a way to make it work with all pictures in general? I have a picture gallery with Lazy-K Gallery and would love it to work with those pictures as well.
thanks again. so glad I at least got it to work and it is worth the manual input if that is what needs to be done.
Matt
Kim Aug 23rd, 2006
hello! i fixed the problem i presented in post #202, i used CSS opacity instead as implemented in the lightbox 2.0
i have a question for the lightbox 2.0… for me, having to hover over the photo to know about the next/prev feature poses some usability problems. i dont know a thing about javascript and very little about css, so i was wondering if you could possibly tell me how to make it so that the next and prev are already showing even without hovering over the photo. and because that kinda ruins the photo, how do i have them positioned at the very top? what do i do to the JS and CSS to make that work?
your help would be very very much appreciated! :-)
Kim Aug 23rd, 2006
oops.. i posted in the wrong place, i’ll just put this where it belongs >> http://www.lokeshdhakar.com/2006/03/29/lightbox-v20/
Brady Sep 2nd, 2006
What can I do if the overlay is covering and shading the photo? It’s not doing this in IE, but it is in Safari on my Mac. You can see an example here, if you are using a mac, you may get the same problem? >>> http://www.sunshinehahn.com
Brady Sep 2nd, 2006
got it — my z-indexes were off for some reason. I got the code from another site.
rolf Sep 14th, 2006
great Script! Works Perfekt :)
Grant Hood Oct 1st, 2006
Hi there
I used lightbox on steve-edwards.com/paintwork.php and my client reported it crashing two of his PCs (IE6) on a couple of pages where I’d used a div to fill space and push the following content onto the next line. One of the machines had Yahoo toolbar and one had AOL and I think this was related to the problem. I’ve fixed it by using a transparent gif to fill the space instead of the div but I’ve left a copy of the problem version at steve-edwards.com/paintworktest.php. The div that crashed these pcs has the CSS “.blank {width: 100px; height: 75px; float: left; padding:2px 5px 2px 0px;}”.
I can’t recreate the error on my machine despite installing the Yahoo toolbar (I’m not installing AOL through bitter previous experience) so I only have my client’s description of what happened.
Hope this helps with Lightbox development as it’s been a great improvement from the method of displaying images I was using before. If you’d like any more information please let me know.
Cheers – Grant, UK
bets Oct 2nd, 2006
I’m trying to wrap it into pmwiki (.php wiki tool which is html enabled):
see this page: http://www.lmm-anne.net/pmwiki/pmwiki.php
but no lightbox shows up. i’ve tried different versions of the script on the first three thumbnails. any suggestions?
George Oct 3rd, 2006
Great work!
Hans Peter Johannsen Nov 13th, 2006
Dear Sirs
A friend of mine has cerated a new homepage for me using lightbox.
After a period of time I have experienced that IE closes down when it comes to a page where lightbox has been used.
I have had my computers cleaned and reinstalled now 2 times and for a short period the site is showing ok again in IE – but after a period of 2 -3 weeks the same problem occur again. The site is ok in Mozilla Firefox no problems.
My computer expert claims that the problem is Lightbox that create a small file – saving stuff on my computer and after a while the file is full and then IE closes down.
My homepage is this: http://www.toscana-vacanze.dk/2006/ferieboliger/nord/5pers/la%20foce/index.asp
Have you experienced the same before?
Regards
Hans Peter Johannsen
brand Dec 6th, 2006
Just made script working… uff…
It’s really great, txs.
For those who use Wordpress, and don’t know much (or want to avoid hassle) – set up folder ‘images’ in main folder where Wordpress sits – only if you’re experiencing problems with not displaying loading.gif and closelabel.gif properly – easy, but took me 2 hours… :-)
You can see it now in action!
http://empirecast.com
Poggs Dec 11th, 2006
Thansk so much for this – its a huge help! :)
Poggs Dec 11th, 2006
Thanks so much for this – its a huge help! :)
Vk Dec 21st, 2006
Hey Lokesh,
Thanks a lot for the fabulous script.
Had one query though.
I have a no of users uploading images of various sizes., some of them are quite big. So, I tried to provide a fixed height of about 200px to the lightbox element in the css. But that messed up the look and feel of the lightbox.
Any suggestions?
tristan Dec 25th, 2006
Hi really great script! I’m testing it at the moment and it works really well. I have only 1 question; is it also possible to make the details more complex like adding html and for instance a link? Instead of using:
title=”hellolink“
Brady Dec 30th, 2006
Hopefully this hasn’t already been addressed but the close box appears off the right side of the image on my site. I am using default script and the provided css and images. Thanks for your help
example is at http://www.globalnewsnow.info/entertainment/fun/
click a cartoon
Mickey Jan 15th, 2007
Hi.
I’ve been struggling with this for a while.
I want to have the name of my photo to display bold, then a description of it underneath in regular type, how can I create a second line of text?
THANKS
RealTalkNY Jan 21st, 2007
Is it possible to get this to work with the fotobook plugin. I installed it and put the code into the header, but when I go to my phto gallery it doesn’t work at all. Do I need to put the code somewhere else?
SmashThePain Feb 1st, 2007
Hello, scripts is look very good, but in one function code is not very good.
function pause(numberMillis) {
var now = new Date();
var exitTime = now.getTime() + numberMillis;
while (true) {
now = new Date();
if (now.getTime() > exitTime)
return;
}
}
This is my variant.
function pause(sender)
{
var curently = new Date().getTime() + sender;
while (new Date().getTime()
SmashThePain Feb 2nd, 2007
This is variant.
function pause(sender)
{
var curently = new Date().getTime() + sender;
while (new Date().getTime()
Rini Feb 27th, 2007
I LOVE this code. But I was wondering, is there a way to do something like this with sound files too?
Julia Mar 16th, 2007
I love this!
I have an issue with a swf (movie clip) file that is on my page – it plays on top of the lightbox image. Do you know of any way to fix this?
Thanks!!
rachel Apr 18th, 2007
hi, i’m having the conflicting js scripts problem when i use this. basically, to get this to work i have to disable my nav rollovers on the page in the body tag. It seems i can only get this or the rollovers to work, but not have both work on the same page. any ideas? thanks!
you can see here http://www.fuzzyrobot.com/work3.html the first thumb (elvis) works with your script. the top nav now, doesnt.
Ricci J. Apr 22nd, 2007
This is a fantabulous script.
I’m just having many problems with it.
The overlay.png file must not be loading porperly,
so it doesn’t show up.
And also,
when the image comes up,
there is a blue border around pracatically everything.
I’ve tried working the css script to stop this,
but nothing will work.
It may be the program I am using, maybe?
lemonyem Apr 27th, 2007
This is awesome! And even more so is that you posted it under user commons. Thanks so much!
fabioaro May 2nd, 2007
please, I can’t make the overlay work…please take a look at http://www.fabioaro.com
could you please send me an email to contato@fabioaro.com ?
thanks a LOT!
oliver May 10th, 2007
thank you for that great ligthbox-script. it’s really easy to handle.
nevertheless i’ve got a little problem using version 1.0 – but please take a look:
http://www.wanderpfa.de/de/index.php?option=com_frontpage&Itemid=1
after pressing of the picture with the eagle…lightbox starts…yeeah ;o)
now look at the scrollbar at the bottom – it enlarge!!! That’s my problem…
I’m glad for any information to avoid this bug.
oliver
tidy Jun 24th, 2007
i seem to be having issues …
the lightbox call works great when on the individual post, but on my main page it doesn’t seem to work … it opens the image in a new page, rather than the lightbox overlay …
http://www.itsadirtyword.com/blog/
vs
http://www.itsadirtyword.com/blog/?p=109
please help me … thanks !!!
ArjunMunuSwamy May 21st, 2008
I hod got a problem while using lightbox and sifr together. The problem is while opening the image in the lightbox the h1 bar which is presented with the wite back ground. The solution is give a seperate class to the bar and place the gif image instead of text and give text indent:9999px; to the text the problem will be solved.
arpan Jun 27th, 2008
the script is great…but..
When the Lightbox window pops up, my embedded music player does not get greyed out. why is that and how can I fix that?
Also, how can I make it so I don’t have to put the rel=”lightbox” tag in every image I want to have the lightbox effect used for? can I default the lightbox effect for every image on my website without having to put that tag in?
Do you know how I could have this same effect for Youtube videos and other movie type media? I’ve used the VideoBox plugin before, but that renders Lightbox useless. So, I haven’t been able to find a perfect hybrid that does movies and images. Is there a way I can modify the code to accomplish this?
Again, my website is http://www.letitmarinate.com/
Thanks.
John Bent Jul 15th, 2008
Hey Lokesh,
I love LightboxJS, but I’m having a problem getting the close button and load buttons to appear when I use Lightbox on my site.
I can get the images to appear but the buttons that come with Lightbox just load a question mark, in place of close.gif or loading.gif.
What can I do?
Is it a problem with my HTML or with the lightbox.js file?
Any help would be appreciated.
A link to the page with Lightbox installed is below.
http://www.bentillustration.com/Fireworks%20Layouts/Illustration/illustration.htm
John Bent
ken Aug 6th, 2008
DIRECT MOBILES COMMUNICATIONS LTD.
A Registered and Approved mobile company,
We deal with various types of Mobile phones, Laptops, Apple Ipods, Pocket PC, Video Games and many more, All our product are brand new,
1. Complete accessories(Well packed and sealed in original company box)
2. Unlocked / sim free.
3. Brand new (original manufacturer) box – no copies
4. All phones have english language asdefault
5. All material (software, manual) – car chargers – home chargers – usb
data cables -holsters/belt clips – wireless headsets(bluetooth) – leather and non-leather carrying cases – batteries.
If you are interested, forward your questions and enquires to us via
email with your order and shipping details. we give 1 year warranty for every product sold out to our costumers, our product are company class 1 tested and approved by global standard organization of wireless industries, Brand new merchandise with complete accessories, extra charger and battery.serious buyers should.
Contact us on: E-mail…..directmobiles11@yahoo.com
NEW Nokia N96 $260usd
New Nokia N95 $230usd
New Nokia N75 $200usd
New Nokia 5300 $130usd
New Nokia 7373 $140usd
New Nokia 7390 $200usd
New Nokia n93 $170usd
New Nokia n92 $190usd
New Nokia n91 $180usd
New Nokia 8800 $220usd
Nokia 8800 Sirocco $230usd
NEW Samsungs
New Samsung X830 $160USD
New Samsung P310 $160USD
New Samsung P900 $170usd
New Samsung D900 $280usd
New Samsung e800 $160usd
New Samsung sgh-d410 $270usd
New Samsung sgh-e700 $150usd
New Samsung sgh-e715 $170usd
New Samsung sgh-p100 $130usd
New Samsung sgh-s300m $100usd
New Samsung x450 $100usd
New Samsung SCH-i730 $130usd
NEW Motorola
New Motorola K1 $180
New Motorola Razr maxx $230USD
New Motorola Razr v3xx $250USD
New Motorola pebl u6 $150usd
New Motorola V6 $150usd
New Motorola L7 $165usd
New Motorola e680 $200usd
New Motorola razor v3 $90usd
New Motorola v220 $170usd
New Motorola v80 with Bluetooth $260usd
New Motorola v872 $200usd
NEW Sony ericsson
New Sony Ericsson k790A $230usd
New Sony Ericsson p990 $200usd
New Sony Ericsson w900 $180usd
New Sony Ericsson p910 $180usd
New Sony Ericsson z1010 $160usd
New Sony Ericsson z600 $130usd
New Sony Ericsson s700i $150usd
New Sony Ericsson s750i $180usd
New Sony Ericsson W800i $180usd
New Qtek
New Qtek s200 $100
New Qtek 9000 $130
New Qtek 8310 $200
New Qtek 7070 $250
NEW Sidekick
New LRG sidekick 3 special Edition $170usd
New Sidekick 3 $150usd
New Sidekick 2 $120usd
New Pink couture sidekick 2 $155usd
New Mr. Cartoon sidekick $150usd
NEW E-ten
New ETEN G500……$200usd
New Eten M500……$180usd
New ETEN M600……$200usd
NEW Nextel
New NEXTEL I930 …$130USD
New NEXTEL I870….$120USD
New NEXTEL I860….$100USD
NEW Treo
New The Treo 700w…$190
New The Treo 650….$140
New The Treo 700p…$190
NEW Imate
New I-mate JAM 850…$140
New I-MATE K-JAM …$270
New i-MATE JASJAR…..$200
NEW Blackberry
New Blackberry 8707v $250USD
New BlackBerry 8700r….$200
New Blackberry 8700c….$200
New Blackberry 8700g….$210
NEW Apple Ipod
New Apple iPod nano 4GB….$131.50us
New Apple iPod nano 2GB….$112.00us
New Apple 60 GB iPod photo….$130.00USD
New Apple 30 GB iPod Photo….$116.00
New Apple 512 MB iPod Shuffle MP3 Player….$94.00
Brand new Video Game
New Xbox 360 …$200
New Psp (play station)..$145
New Ps2…$145
New Ps3…$205
PDA
New HP IPaq Pocket PC H4150 ========= $190
New Asus MyPal A716 ================= $175
New HP IPaq Pocket PC H4350 ========= $185
New palm Treo 650=====================$240
LAPTOPS
New APPLE G4 POWERBOOK 1.5GHZ SUPERDRIVE WITH 15 INCH
DISPLAY……..$700
New APPLE G5 POWERMAC 2.0GHZ DESKTOP COMPUTER……..$700
New APPLE G4 POWERBOOK 1.5GHZ SUPERDRIVE WITH 17 INCH
DISPLAY……$600
New SONY VAIO A217S 100GB512MB RAM XP HOME………$500
New SONY VAIO B1VP 40GB HD 512MB RAM XP PRO……….$430
New SONY VAIO T370P/L 60GB HD 512MB RAM XP……..$400
New Toshiba G25-AV513 Qosmio Laptop Computer (Refurbished)…$600
We sell in Bulk order, and in GOOD Discount prices,We make shipment through fedEx courier services and UPS, and they deliver within 2-3days home delivery,
Thanks
The Management.
E-mail…..directmobiles11@yahoo.com
porn Dec 4th, 2008
She hademptied her up right away. I pressed her sides mature woman in porn again, and lay down.
CJW Feb 5th, 2009
hi,
I’m having a problem with a part of the code for the lightbox.
The effect seems to work but a blue square with a question mark is appearing instead of the close.gif.
i expect this has been mentioned before but after checking for a while there are just too many comments. :)
Any help would be greatly appreciated.
Amber Feb 6th, 2009
I am having problems with the lightbox effect on my “portfolio page”. When viewed on PCs in Windows Internet Explorer (version 7.0, I think), it puts “breaks” in my page… like a border… around each Lightbox jpg I have linked. Can someone please help me?? Thanks!!
Victor Jun 12th, 2009
This peice of code is awesome
Stan Jun 12th, 2009
I agree to you dude
Great Script! Oct 26th, 2009
This is a very useful and functional script! Is there any way to get the close button to appear at the top of the window, not the bottom? I seem to remember seeing a fix for this for the WordPress plugin but not for the standard lightbox.js. Does anyone know how to do this?
madhur jain Nov 18th, 2009
really nice stuff.. looking for more such stuff from you.
Anonymous Nov 20th, 2009
I love it! No problems whatsoever. I’m doing a site for a Mac based client and it has no issues with Safari 4.0 or Firefox. Fantastic and very Apple!