Sponsored by Activision
Band Hero view!
guitarhero.com - The biggest event music event of the year is now in your living room.
77 Comments
- mindsnare, on 10/12/2007, -2/+44go yell at the IE7 Dev team for that for not developing their browser properly CSS compliant....again
- plasticated, on 10/12/2007, -1/+41Use thickbox. You'll have loads of extra features to play with then.
http://jquery.com/demo/thickbox/
It also fixes the scrolling bug found in the above tutorial. - Hemingrubbish, on 10/12/2007, -0/+28or even lightbox JS 2.0
http://www.huddletogether.com/projects/lightbox2/ - hadiz, on 10/12/2007, -1/+23Yeah, or lightbox JS
http://www.huddletogether.com/projects/lightbox/ - andreas1999, on 10/12/2007, -0/+19probably due to digg's bad login functionality.. if you check the frontpage via rss and click two stories, try to comment on the first story and you'll be redirected to the second afterwards (last one clicked).. annoying!
- diggitydank, on 10/12/2007, -1/+20I think this comment belongs here:
http://www.digg.com/hardware/Watch_Satellite_TV_anywhere_just_be_sure_your_facing_south
Careful with those errant clicks. - Xpiatio, on 10/12/2007, -0/+17You people mention Lightbox and Thickbox. Both are good for what they are. I use Greybox. http://orangoo.com/labs/GreyBox/
- smoothmedia, on 10/12/2007, -9/+22Sadly this doesnt work in my browser (IE7), it simply makes the screen entirely black
- senfo, on 10/12/2007, -2/+14I don't see how 2 lines of JavaScript to the 9 lines of CSS is more "more of a JavaScript trick". What it really should be called here is DHTML; but whatever.
- insidein, on 10/12/2007, -1/+9You have to use filters in IE, here is a link about filters:
http://msdn.microsoft.com/library/default.asp?url=/workshop/author/filter/filters.asp - herkalees, on 10/12/2007, -0/+8To make this same effect also work in IE6 (and 7 too I believe), just add this one line of Microsoft-only code to the CSS style declaration:
filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);
P.S. Digg comments, lately, are filled with many whiney bitches lately. - mindsnare, on 10/12/2007, -0/+7you'd be able to do this with the nice fading effect which frankly is what makes it pretty using.
http://script.aculo.us/
good examples there - nauzilus, on 10/12/2007, -0/+7Ew, so it does. God knows why you're getting dugg down for that comment though. Perhaps someone could actually comment why they dugg you down?
I'm happy that it works in Opera, even though I use it as my main browser, it always seems like complicated javascript and css things sometimes confuse it. I like to believe that it's because Opera is flawless and it's just the author playing silly buggers, but I know that's not true ;) - Ebeniz, on 10/12/2007, -2/+9huh?
- timdorr, on 10/12/2007, -0/+7I'd skip lightbox. It takes over 100K of JS code and is limited to images. ThickBox is just about 30K and does images, inline content, external files, and AJAX.
- viriiman, on 10/12/2007, -2/+9Umm, Yes?
- codethis, on 10/12/2007, -0/+6just because another website fades the page doesn't mean that it was jacked
the code is totally different - chris9902, on 10/12/2007, -0/+6if you set the postion to fixed not absolute you can scroll the screen and the overlay will never move off screen. The only problem is IE6 doesn't support fixed.
- kudos, on 10/12/2007, -1/+7Really?? WOW, i bet they came up with the idea....
- jkaiser, on 10/12/2007, -0/+5i wish this was posted 3 weeks ago. i just spent 20 minutes making my own cause I couldn't find a good one. Oh well...
- halleyscomet, on 10/12/2007, -5/+11@pavetheforest
You think so?
Well then, show us your example. Show us the code you wrote that does a better job.
Since you were so free and harsh with your criticism, you MUST have written something more impressive, right?
Now, if you DON'T have or know of a better implementation that will run in "most modern browsers," then you're just a troll, in which case I can safely block you without missing out on anything interesting. - guytoronto, on 10/12/2007, -1/+6That's nice and all, but you have now sacrificed functionality for coolness.
I can't select and copy your e-mail address, so I have to manually type it into my address book (sure, I can use the VCard, but I don't like downloading anything foreign). I can't open your contact info and about you in a separate tab. You've spread a 1/2 page of information over three pages of "cool" graphics.
Give me clean and functional any day. - morbidous, on 10/12/2007, -0/+5Yeah, I pretty much agree with you in this one. It's a shame that the large majority of Web Designers prefer to put their efforts on bells and whistles over usability and accessibility design...
- Scarblac, on 10/12/2007, -0/+4What I don't understand is, why does he use Javascript to set "display: none" on the background initially, when he could have just added that line to the CSS in the first place.
- caffiend, on 10/12/2007, -2/+6Sadly, some people still use IE.
- marksy, on 10/12/2007, -1/+5ugh, title says CSS - but it ALSO requires JS.
nice work! - Vizin, on 10/12/2007, -0/+3"filter: alpha(opacity=70);" in place of "opacity: .7;" is the best way to get it to work in IE. Put both in, as filter doesn't work in real CSS.
- mooninite, on 10/12/2007, -0/+3Works fine with Firefox 2.0 in Linux.
- converge, on 10/12/2007, -1/+4http://www.duggmirror.com
- gaetanocaruana, on 10/12/2007, -0/+3does not work well on firefox2. There is part of the screen at the bottom that is not covered by the dim effect
- herrin, on 10/12/2007, -0/+2Greybox is awesome. I just finished adding lightbox to a project, i'm definitely switching to Greybox today. The size alone is worth it. Thanks for the link!
- pagani07v2, on 10/12/2007, -1/+2i'll never understand why you care
- inactive, on 10/12/2007, -0/+2Wow, Greybox is a DAMN nice looking one! Color me impressed. I could definitely find a few uses for this in my web pages. Thanks for the head's up! Digg rules.
- halleyscomet, on 10/12/2007, -0/+2@kudos
In other words, you not only think it's a poor implementation, but have experience and specific criticisms to back up your opinion!
Are there any other Open Source implementations you would recommend using instead? - inactive, on 10/12/2007, -0/+2i dont see the effect thats in the screen shot using firefox 1.5.0.8 or ie7. what gives?
- Braxo, on 10/12/2007, -3/+5I wouldn't label this plugging his own blog. I thought this is a cool effect and an effect I used on a website. Except I did with Adobe's Spry (http://labs.adobe.com/technologies/spry/).
Keep in mind loading spry uses a lot more bandwidth than 12 odd lines of code, so this is a legitimate article in my view. - JoeDonH, on 10/12/2007, -0/+2Wow, go to his "new" website:
http://www.dbachrach.com/
and click on "Contact". If I didn't know better, I'd swear that was Zach Braff from "Scrubs". - eljaysun, on 10/12/2007, -1/+3That CSS effect really goes great with the tables used in the example site.
Yikes. Missing the point of CSS? - tigerpaper, on 10/12/2007, -0/+2This opacity filter is still kind of iffy in IE. For instance, when applied to img tags.
Does anyone know how a completely cross-browser css effect such as this can be applied without js?
I'm going for an opacity->opaque effect such as used on the homepage of cssremix.com but for some reason can't seem to get the i.e. css opacity working on imgs.
Help? - stoppedcode12, on 10/12/2007, -0/+1yeah, digg should use ajax for logging in and allow us to digg the story without reloading the page.
- Dotcommer, on 10/12/2007, -0/+1Hey, anyone out there have an idea how to combine the nice scaling effects of Lightbox JS 2.0 with the ability to show flash animations or any other kind of movie file format within the script like pictures are shown? (christ, did that even make sense? haha). Would greatly appreciate it if anyone has any insight. Don't really want to use Thick box or grey box (if i can avoid it) just because I like the animated effects from Lightbox.
- nauzilus, on 10/12/2007, -3/+4Oh God, what a drag!
Your post doesn't say anything about requiring sarcasm. As such, I'm sure the author will appreciate your compliment of their "nice work". - shockertwin, on 10/12/2007, -0/+1Once again, you have to use microsoft filters. Untill IE8, you wont be seeing any significant improvements in this CSS *****.
- Zarthia, on 10/12/2007, -0/+1wow... in IE7 your screen goes black instead of transparent Grey... got Microsoft... not
- jkaiser, on 10/12/2007, -0/+1Well, when I was looking for it I didn't know what to call the effect. Searching for "background fade" or something similar doesn't return what you want.
- codestain, on 10/12/2007, -0/+1Nice job, helped me out with something for my job....
As for those fussing about IE.... the percentages wouldn't work for the width and height. I changed it to pixel values and it works great for me... under IE6 testing anyhow. I'll be testing IE7 later today. I basically ended up with the css something like the following:
.darkenBackground {
background-color: #FFFFFF;
FILTER:Alpha(Opacity=30); /* IE */
opacity:0.3; /* Safari, Opera */
-moz-opacity:0.30; /* FireFox */
z-index: 20;
height: 2100px;
width: 660px; /* Cover our maximum width */
width: 660px;
width: 660px;
background-repeat:repeat;
position:absolute;
left: 0px;
}
I couldn't find this information anywhere after googling... So, maybe it will help others. - novaworks, on 10/12/2007, -0/+1nice, but there are already a ton of "lightboxy" effects already available.
Also - this doesn't work with IE and although it seems that people sometimes think you can ignore 80% of the browser market, you unfortuanately can not. It doesn't matter that FireFox is 100 times better than IE - if it doesn't work with IE then it's er....totally useless. - codestain, on 10/12/2007, -0/+0oops... duplicate comment.... ignore the triple widths in that last comment...
- michaelvaf, on 10/12/2007, -1/+1some cool links here! dugedy dug dug
- DevilsAdv0cate, on 10/12/2007, -0/+0Is this the one that produces a the fade effect like the one when using the menu at www.damninteresting.com? If so, this is lame.
-
Show 51 - 77 of 77 discussions



What is Digg?