Re: [css-shaders] CSS shaders for custom filters (ACTION-3072)

On 5/10/2011 5:22 AM, Gregg Tavares (wrk) wrote:
> On Mon, Oct 3, 2011 at 8:12 PM, Dean Jackson<dino@apple.com>  wrote:

>> When I first read this I thought you were asking for the current pointer
>> coordinate to be provided as a default input to the shader pipeline. That's
>> an interesting idea and might avoid scripting in some cases (you could
>> always do it with custom parameters in the proposal Vincent sent). We'd need
>> to decide which coordinates though - screen, page, element.
>>
>> But that's not what you're asking, I think :)
>>
>
> Maybe this will make it clearer.
>
> This page (only works in Safari currently)
> http://greggman.com/downloads/examples/interactive-3d-css-element.html
>
> Is transforming an iframe. Note that the iframe is completely interactive.
> You can click on the links, you can type in the search box, etc...

Offline using your code, if I replace this code,

<iframe src="http://games.greggman.com" width="100%" height="100%"></iframe>

with this code,

<iframe src="http://css-3d.org/" width="100%" height="100%"></iframe>

I have a perfectly accessible page. I can navigate the iframe to access 
the demos.

If I have this code,

<iframe src="http://www.google.com" width="100%" height="100%"></iframe>

it also seems to work as I can hover links, insert text into the inputs 
and navigate the iframe. I can even perform a search.

The only thing I can activate with at http://games.greggman.com is the 
text and submit inputs via tabbing.

By my experimenting via elimination, I would suggest that there is no 
issue with CSS3 3D transforms but something wrong at your domain.

I did another test by loading google in the iframe offline. I searched 
my name and went to my domain. I then went to the links section on my 
home page and followed the link to the www-style archives and found your 
message (the one I'm replying to now). I then selected the link to your 
test. To my amazement your domain became active. All the links work, the 
hover events work. Oddly though, I am accessing your domain by way of an 
iframe within and iframe.

http://css-class.com/x/gregg-iframe.png

> CSS shaders would allow me to morph that iframe into a torus. (see mockup
> screenshot here:
> http://greggman.com/downloads/examples/interactive-css-shader-element-mockup.png
> )
>
> In order for that iframe to stay completely interactive the browser will
> need to transform mouse events through the vertex shader so that the page is
> still usable.

Can you please point me to a page that shows how to morph like that (the 
webkit prefixed code would help)?




-- 
Alan Gresley
http://css-3d.org/
http://css-class.com/

Received on Wednesday, 5 October 2011 04:38:44 UTC