Hacker Newsnew | comments | ask | jobs | submitlogin
Real Shadow: jQuery Plugin that casts photorealistic shadows (github.com)
80 points by illdave 707 days ago | comments


mxfh 707 days ago | link

This one even had lights. Illuminated.js – 2D lights and shadows rendering engine for HTML5 applications http://news.ycombinator.com/item?id=3958251

-----

aw3c2 707 days ago | link

Maybe it is the amount of shadow-casting items on that page but if your landing page maxes out my cpu and lags badly, I say goodbye faster than 20 frames render. (I use Opera.)

edit: They do look good though!

-----

hamoid 707 days ago | link

Where is the cursor on my phone? :)

-----

Cushman 707 days ago | link

The effect is cool, so I hate to ask this, but-- in what sense is this "photorealistic"? They look like normal soft shadows to me.

-----

vph 707 days ago | link

in a marketing sense.

-----

Cushman 707 days ago | link

The normal computer graphics meaning, then.

-----

ars 707 days ago | link

I moved the cursor across the page and nothing of interest happened. This is Firefox 12. It did work on chrome though.

-----

KwanEsq 707 days ago | link

Do you have NoScript or similar? Even with scripts enabled it doesn't work for me, because of the mimetype: "[NoScript] Blocking nosniff Javascript served from https://raw.github.com/Indamix/real-shadow/master/realshadow... with wrong type info text/plain, inline and included by http://indamix.github.com/real-shadow/

Edit: the fix is to add https://raw.github.com/ to the pref noscript.inclusionTypeChecking.exceptions in about:config

-----

ars 707 days ago | link

Yup. Although I did switch it to "allow scripts globally", but I guess that's not enough.

And, sorry, but I'm not going to add that to about config.

-----

asto 707 days ago | link

Works on Firefox 12 (Linux) for me!

-----

kevingadd 707 days ago | link

Doesn't work in Firefox 14 either.

-----

KwanEsq 707 days ago | link

See my reply above.

-----

ddon 707 days ago | link

On iPad I see shadows, but can't control them...

-----

jgv 707 days ago | link

My company released this effect a couple of months ago: http://okfoc.us/okshadow/ and https://github.com/okfocus/okshadow

-----

PhrosTT 707 days ago | link

2000 - drop shadows.

2005 - transparent drop shadows.

2012 - realtime drop shadows!

-----

alttab 707 days ago | link

This pegged my duo core at 100% for both cores. Realtime shadows are great and all, but if I needed to achieve them I'd imagine I'd use WebGL if I didn't care about CPU or battery.

Using jQuery for this type of problem seems a little out of place to me. That said, this is certainly "neat." THAT said, I don't believe this has real world practical value. Its too computationally expensive considering what it adds.

-----

jmah 707 days ago | link

I'd use WebGL if I did care about CPU and battery.

-----

jgv 707 days ago | link

for a real world application – at okfocus we used our version of this effect on http://tugofstore.com and it added to the realtime "tug" effect by making it more of a visceral experience for users. perhaps ours is less computationally expensive idk.

-----

inafield 707 days ago | link

Impractical now, but cool as a tech-demo. i7-2640M cpu usage is at 24% on Chrome Canary 21 with this.

-----

evride 707 days ago | link

"Perfect for eye-catching demos and landing pages."

Can we stop creating stuff in JS/CSS that we would have ridiculed other people for doing in flash? I can't possibly think of any situation where this would be useful for a landing page.

-----

Cushman 707 days ago | link

Flash wasn't ridiculed because of how it looked. The principle of integrating interactive content into web pages is a fine one, so long as it's done in a way that's semantically consistent, machine readable, searchable, accessible, reliable, not too obtrusive, forgiving of network latency and performance, cross-platform, cross-device, and tolerant of errors -- the web, in other words. Flash was... not.

That doesn't mean we stop trying to make web pages look prettier.

-----

basseq 707 days ago | link

It may just be for demo purposes, but using the mouse cursor as a light source seems like the 2012 equivalent of animated GIF backgrounds. Might be cool it could you specify a point light source at a given coordinate and let the page render from there.

-----

iambot 707 days ago | link

You can. if you read the github readme, is shows clearly how to both disable the mouseFollow and set a global light source.

-----

illdave 707 days ago | link

Just to confirm, it's working well on Chrome 20 on Mac for me (no lag, not maxing out the CPU, very smooth). It's interesting from a technical perspective, although design-wise I can't really see any practical reason to use it. Fun though.

-----

asto 707 days ago | link

Works quite nicely on Chrome. Too much lag on Firefox and Opera!

-----

lucian1900 707 days ago | link

Works on FF 12, but it's extremely slow.

-----

petepete 707 days ago | link

Beautifully smooth for me, with Chrome 20 on Linux.

-----

jheriko 707 days ago | link

FYI doesn't work with IE 10

-----

happypeter 707 days ago | link

ubuntu1104+Chrome: perfect Mac+firefox13: a bit slow

-----

regnum 707 days ago | link

Looks very nice in Chrome.

-----

savories 707 days ago | link

Needs more lens flare. And some bevels. Then we're back in 1998.

-----

riotgibbon 707 days ago | link

well, I liked it, well done

-----




Lists | RSS | Bookmarklet | Guidelines | FAQ | DMCA | News News | Feature Requests | Bugs | Y Combinator | Apply | Library

Search: