Sponsored by Bing
When Should I Book My Flight Home for Christmas? view!
bing.com - Bing predicts if your fare is likely to fall by $50 or more within 7 days. Shockingly accurate.
93 Comments
- Lynch901, on 10/12/2007, -0/+4I love how people are really bending CSS to their own will now. Bring it on.
- robsta, on 10/12/2007, -0/+2"No, I do _not_ want webpages to look like that! Come on, give the visitors a little freedom to use your page the way they want. Link directly to the image file."
If people want freedom, they disable javascript (common sense!!) and it degrades perfectly.
"Is there any way to use this on Blogger where you can't upload javascript files?"
You need to copy the contents of lightbox.js into the head of your blogger template (enclose in tags). This is not very wise, but is a quick, dirty way of doing this.
I think this is a very smart method, but I can see how advertisers can defeat pop-up blockers. - thefrenzy, on 10/12/2007, -1/+3What's even nicer is that it degrades gracefully if you have JS turned off (it simply links to the large image). 10 for looks and 10 for execution, I like.
- Moocat, on 10/12/2007, -1/+2Maybe I'm just crazy but I don't like it at all. I'd rather have the original image myself, although the application of this technique might be useful in other aspects.
- inactive, on 10/12/2007, -0/+1This is great! I love the fact you can click anywhere on the picture to close it, not have to click on some hard to find custom x or close button, or have too many browser intances open, or lose my place in the page because the picture took me away. I can think of a million uses for this.
- vh1`, on 10/12/2007, -1/+2"No, I do _not_ want webpages to look like that! Come on, give the visitors a little freedom to use your page the way they want. Link directly to the image file."
*goes to page*
*middle-clicks image*
*image opens in new tab as expected*
they /do/ link to the original image. I haven't looked at the script's source yet, but I assume it just looks for links with the rel attribute that's set to lightbox, so it will still degrade perfectly - hagrin, on 10/12/2007, -0/+0I agree with swhite. People need to read the comments.
- swhite1987, on 10/12/2007, -0/+0""This is brilliant. Only thing is when view when displaying images with large dimenstions it sometimes cuts alot of the edges off.
Any one know a work around?"
--
This is how you fix the "large images (images size > browser size) gets cut off" problem. Open lightbox.js and look for:"
The code is in the comment that this quote came from. Learn to read the comments before commenting yourself and maybe you'll find it. - MattLat, on 10/12/2007, -0/+0Doesn't work in Firefox 1.5, all it does it make the site dark and makes nothing clickable - too bad, I was excited, too. Someone should tell the author so he can retract his "works on all modern browsers." statement
- Gongrc, on 10/12/2007, -0/+0Very nice!
- KarmannGhia, on 10/12/2007, -0/+0> Is there any way to use this on Blogger where
> you can't upload javascript files?
Here you go:
http://www.cynosurex.com/software/Lightbox_JS/ - pickatutorial, on 10/12/2007, -0/+0This one is a very nice JavaScript tutorials collection:
http://www.pickatutorial.com/tutorials/javascript_1.htm - diggidydawg, on 10/12/2007, -0/+0pretty cool, I'm gonna try it out on my site.
- narcissus, on 10/12/2007, -0/+0"Doesn't work in Firefox 1.5, all it does it make the site dark and makes nothing clickable - too bad, I was excited, too. Someone should tell the author so he can retract his "works on all modern browsers." statement"
Beg to differ ... works fine on FF1.5, check your settings. - dxxb, on 10/12/2007, -0/+0nice effect! +digg
- jftuga, on 10/12/2007, -0/+0I think that I will implement something like this for my family photos.
- HiddenS3crets, on 10/12/2007, -0/+0B.E.A.utiful
- chrishill, on 10/12/2007, -1/+1well, that didnt take long to integrate into wordpress! loving the functionaility of this script, props to the creator.
here it is on my site... http://www.chris-hill.co.uk/
be gentle with the site itself, its not intended to be groundbreaking, revolutionary, interesting or original... its just m'blog! - RiddickRom, on 10/12/2007, -1/+1I love it, it really brings the image forward and adds a nice feel to the site too.
Nice implementation of it there chrishill, it adds a really nice touch to your blog. - paulypopex, on 10/12/2007, -1/+1"No, I do _not_ want webpages to look like that! Come on, give the visitors a little freedom to use your page the way they want. Link directly to the image file."
That page does link directly to the image file, check out the source of the page - - V2Blast, on 10/12/2007, -0/+0Looks pretty. CSS is awesome, but people rarely seem to take advantage of all the things it can do, especially when combined with other things like JavaScript. I like that. And regarding the large images, I think you would have to downsize the image before linking to it through the JS.
- eaasness, on 10/12/2007, -0/+0Me Likey
- Googled, on 10/12/2007, -1/+1"Looks nice.
Here's my implementation using script.aculo.us effects.
http://www.ajaxcms.org/gallery.html
(click on the pics)"
thats very cool!! any chance of getting the scripts =0 - jamesburton1, on 10/12/2007, -0/+0Nice!
- swhite1987, on 10/12/2007, -0/+0Not all people realize they have a middle button. This is well designed.
- MAG1CO, on 10/12/2007, -0/+0Brilliant. Gonna have a play with this now!
- Phyrefly, on 10/12/2007, -0/+0Does it support images that are wider than the screen res?
- Vektuz, on 10/12/2007, -0/+0I really don't like this.
I mean, its cool, but the optimal way for me to view a bunch of screenshots is to middle click on them in sequence, so they all load up in tabs in the background. Then I can just flip through them quickly as I close each tab. They all load simultaneously in the background, and are ready by the time I get to them.
With this system I have to wait for each one individually, and I can't read the article while the pictures are loading (in tabs in the background).
Digg... but not like. - Dhalgren, on 10/12/2007, -0/+0I'll have to play with this. What I would like to add would be an option of adding a caption under the large image as well as navigation options to go to the next image instead of having to close it and click on the next thumbnail.
- SupaDawg, on 10/12/2007, -0/+0"Completely of agreement with you! Only the Web evolves, it is necessary to evolve with him. IE and opera are not compatible with the standarts Web..... My photoblog uses advanced scripts (Web 2)" http://script.aculo.us/ " functioning only on the browser moderns.(my site is valid W3C xhtml transitional and css...)
A "light" version is in construction for IE and opera."
Maybe you should revise your user agent check. I've never had a problem with web 2.0 standards in IE7 - inactive, on 10/12/2007, -0/+0I Digg for creativity, but it's a duplicate post.
- njbair, on 10/12/2007, -0/+0As someone else mentioned, the best part of this script is that it is completely transparent to the non-JavaScript end user. Graceful degradation is key. I won't use this on my site, because I like to link back to Flickr (where I host all the photos), but digg++ anyway.
- barthook, on 10/12/2007, -0/+0Great use of CSS and JS.
- pulssart, on 10/12/2007, -0/+0A great post http://forum.pixelpost.org/showthread.php?t=3075
- seanami, on 10/12/2007, -0/+0@ RicoLoco : This IS AJAX!?! What the heck are you talking about?
- skydivingdutch, on 10/12/2007, -0/+0Of course the day isn't complete without a CSS guide on the main page. Every day man, every day...
- fr0z3nph03n1x, on 10/12/2007, -0/+0@plussart
No ones going to vist you site becuase you do not program it to be acceptable to more then one browser. I could not view it in IE or Opera. Call me old school, but when I learned to devolop webpage (for a school district) my main goal was to make sure the site looked good for as MANY people as I could, not just firefox fanboys. - reuben, on 10/12/2007, -0/+0pretty sweeeeeeeeeeeeet
- sumdog, on 10/12/2007, -0/+0I really like this. Someone mentioned that it broke the back button, however I disagree. I think I'm doing to make my implementation be setup so clicking on the image goes to the actual image and clicking around it goes back to the thumbnails.
- MasterDwarf, on 10/12/2007, -0/+0One word: smooth.
- ausinatra, on 10/12/2007, -0/+0"This is brilliant. Only thing is when view when displaying images with large dimenstions it sometimes cuts alot of the edges off.
Any one know a work around?"
--
This is how you fix the "large images (images size > browser size) gets cut off" problem. Open lightbox.js and look for:
// center lightbox
objLightbox.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - imgPreload.height) / 2) + 'px');
objLightbox.style.left = (((arrayPageSize[0] - 40 - imgPreload.width) / 2) + 'px');
Replace this with (or comment out above and add the following):
if ( (arrayPageSize[3] - 35 - imgPreload.height) < 0 ) {
objLightbox.style.top = 0;
} else {
objLightbox.style.top = (arrayPageScroll[1] + ((arrayPageSize[3] - 35 - imgPreload.height) / 2) + 'px');
}
if ((arrayPageSize[0] - 40 - imgPreload.width) < 0) {
objLightbox.style.left = 0;
} else {
objLightbox.style.left = (((arrayPageSize[0] - 40 - imgPreload.width) / 2) + 'px');
} - firehydra2k, on 10/12/2007, -0/+0Good concept.
- BasL, on 10/12/2007, -0/+0Dugg, although it's a duplicate for http://digg.com/design/JS_Library_For_Cool_Image_Overlays. And shamelessly plug my added Flickr-functionality for this script on http://www.lovefool.nl/2006/01/07/lightbox-fotos/
- Keithamus, on 10/12/2007, -0/+0"I mean, its cool, but the optimal way for me to view a bunch of screen shots is to middle click on them in sequence, so they all load up in tabs in the background. Then I can just flip through them quickly as I close each tab. They all load simultaneously in the background, and are ready by the time I get to them."
Err sorry, but I am using this script on my page, and it works with me middle clicking the URLs. This script works *perfectly* there is no problems with it on any browser, my CSS of it validates, any browser with disabled java script just treats them like normal links. For those saying this is crap, double check it to see how well thought out it actually is.
Dugg for sure. - Ollekebab, on 10/12/2007, -0/+0Nice! Exactly what I need for my site.
- possum, on 10/12/2007, -0/+0digg ++
- Beanlover, on 10/12/2007, -0/+0Very nice. Can't wait to use. Thanks!
- akhost, on 10/12/2007, -0/+0NICE. Dug.
- dep01, on 10/12/2007, -0/+0Very cool. Expect to see a lot more of things like this.
- AsceticMonk, on 10/12/2007, -0/+0Great script, I have successfully implemented in my blog! Dugg!
-
Show 51 - 93 of 93 discussions



What is Digg?