Live data from Hacker News

WebGL to add 3D hover effects to your website

glecollinet.github.io

61–70 of 115 posts

Re: WebGL to add 3D hover effects to your website

#61
post #36

Earlier quoted context omitted.

Why people keep saying this kind of stuff? For one, whatever Tim Berner's Lee envisoned, the web is not the simple mostly textual medium it was in 1993. Get over it. Second, for people to love reading text on the web, there was never a better time than the present. Lots of long form text by bloggers and content providers like Medium etc, combined with a widespread interest in improved readability and good typography.…

The universal reply to "get over it" is "if it's a problem for me, then it's a problem". Are you sure there's no grain of truth in the complaints about today's dynamic Web? How about this critique, which is hopefully more articulate? http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2011-Nov...

Are you sure there's no grain of truth in the complaints about today's dynamic Web?

Of course there are. But no-one has really articulated an alternative vision. That post certainly doesn't.

Re: WebGL to add 3D hover effects to your website

#62
post #11

Earlier quoted context omitted.

Looks like the integrated GPU in the MacBooks are blacklisted.

My drivers (older ATI card) are blacklisted as well, but starting chrome with the ignore-gpu-blacklist flag works fine. WebGL also works fine within Firefox, so I really don't understand why Chrome keeps blacklisting the drivers...

It may be for security reasons if there are known flaws in those drivers. That it "works" at first glance isn't the only thing to consider here. I wouldn't advise turning off the blacklist for day-to-day browsing: those drivers are black listed for a reason.

Re: WebGL to add 3D hover effects to your website

#63
post #28

Earlier quoted context omitted.

Unsure what the Chrome support is like for 10.6 but current Chrome has WebGL enabled by default. In Safari, you can manually enable it through Preferences>Advanced>Show develop menu in menu bar. Then check "Enable WebGL" in the Develop menu. [EDIT: Also see wmil's comment below.]

Chrome is at the latest version. Even adding the "--ignore-gpu-blacklist" flag doesn't make it work. It does output some debugging info: "(0) : fatal error C9999: marking a sampler that is not a scalar Cg compiler terminated due to fatal error" Enabling WebGL in Safari has bugger all effect. Well, not entirely nothing... it keeps refreshing, freezes while loading or displays the message that "Safari can't display thi…

Try "--enable-webgl --ignore-gpu-blacklist "

Re: WebGL to add 3D hover effects to your website

#64
post #53

My gut reaction to this is that it takes me back to the old days of rainbow dividers ( http://rainbowdivider.com/ ) and animated gifs, a la Strongbad's site: http://www.homestarrunner.com/sbsite/ On the other hand, as with many web technologies, used judiciously this could be cool for interactive infographics and things like that...

I agree. It may be useful in certain web applications, but chances are it will end up being used for advertising and "effects" that are annoying and unwanted.

Re: WebGL to add 3D hover effects to your website

#65
I wonder if WebGL is a cause of global warming?

Instead of creating a server side animation and serving it in compressed format you force every single web-browser to render it.

Also nice work, because it looks good. I wonder if we will see the development of OpenGL caching techniques.

Re: WebGL to add 3D hover effects to your website

#66
post #52

Earlier quoted context omitted.

I have the same problem: Firefox 23 on Debian; Intel GPU (so pretty solid drivers), get.webgl.org works fine and I can't remember when I last had trouble with 3D, but the OP's site crashes my browser. Then again "in the wild" I wouldn't enable WebGL anyway for most sites. Edit: I think it's a Firefox problem. Works in Chromium for me.

Intel GPUs != solid OpenGL drivers. I do a lot of work in OpenGL and I curse Intel almost daily for the multitude of bugs in their OpenGL implementations. The GPUs' only saving grace is their ubiquity so at least I get a bug report quite quickly when a work-around is required.

Which GPUs would you recommend on Linux?

Re: WebGL to add 3D hover effects to your website

#67
post #56

Earlier quoted context omitted.

It is a long term evolution. Eventually, application developers will build directly atop the accelerated graphics layers, freeing the browser to be just a basic virtual machine, and leaving HTML rendering to be just another app built atop that machine. But these things take time and there is a lot of legacy cruft that needs to work in the meantime.

Just like native apps, except the end-user no longer has control over anything. I can't wait.

Care to elaborate? That is not the direction I pictured at all. The open standards of the web should have the opposite effect, allowing anyone to build a computer that can run the major software offerings of the time.

I do not see it really any different to how web applications are developed today, just throwing out the needless overhead. If your concerns are to be realized, it has probably already happened a long time ago.

Re: WebGL to add 3D hover effects to your website

#68

I really like coupling html and webgl, but thus far I've only done it the other way round: adding html on top of webgl. I did this in my last LudumDare game jam [1]. I used html to render nice looking text on top of webgl. Although it's possible to render text within webgl it's messy, especially if you want bold or italic text, different fonts, colors etc. [1] http://min.psywerx.net/

This is pretty cool! Even as simple as this is, it shows how pretty webGL can be, and how it can play nice with DOM elements. Did you have much trouble getting the text to look right?

Thanks! I had no trouble at all with the text. I just created a centered div above the webgl canvas and loaded a custom font from google fonts. I believe I used jquery to accomplish all of this.

It felt like cheating because there was no way I could make the text look this good within webgl under the time constraint (I only had 48 hours for the whole thing).

Re: WebGL to add 3D hover effects to your website

#69
post #35
post #30

Earlier quoted context omitted.

Challenge: First HTML/WebGL/JS implementation of Zelda wins 1,000,000 nerd cred (or Rupees?).

Mozilla might win : http://browserquest.mozilla.org/

that was a super fun little game, with TONS of pop-internet-culture references...

Re: WebGL to add 3D hover effects to your website

#70
post #60

While modern web browsers today may support WebGL, there's far too many computers not using a GPU that supports WebGL. For example, my 5 year old business workstations that run the latest Ubuntu. On-hover WebGL effects only work if you fallback to a static image (an image of the non-hover state) for browsers that don't support it.

From the article linked on the page: http://html5hub.com/using-webgl-to-add-3d-effects-to-your-we...

"Note that, in this demo, I assume the visitor is using a WebGL-enabled browser. A better practice would have been to first implement the page with static images to ensure basic functionality for everyone, then add the 3D effects as a progressive enhancement for advanced browsers."

Post reply on HN