-
200905 May
Posted in CSS3 Previews, Modules
If you want to get a taste of using the CSS 3 Template Layout module, Alex Deveria has written a jQuery plugin which implements the syntax.
I haven’t had the opportunity to try it out yet, so let me know how you get on.
You can skip to the end and leave a response.
-
Comments
-
01.
Peter, do any browsers (released or beta) currently support this naively? Do you know of any browsers working on implementing this?
-
02.
None currently implement it, and none – AFAIK – have begun to implement it – although, I believe I saw it on a Mozilla roadmap for a future version, somewhere.
-
03.
You have to wait for the DOM to load, so it’s not really usable.
CSS3.info should make a petition or something, a movement so that all new browsers support this natively.
-
04.
David says:Comment » May 7th, 2009 at 7:40 pm
If this post is the petition, I hereby sign it with my twenty fingers.
And I also vote for Alexis being named Chief Layout Developer for every browser vendors, so he can teach ’em. :-P
Cheers. Really great work !
-
05.
@Buguletzu – I’m interested to hear why you feel that makes it unusable. Most enhancement scripts (i.e. JS rounded corner generators) don’t run until the DOM is loaded, do you feel they’re unusable too?
Admittedly there is an annoying FOUC-like moment when loading the page, but I don’t see why that should make it too big a deterrent to use. In the upcoming version of the script, there’ll be an option to hide the body until the template’s done rendering, will that solve the problem for you?
Also of course since it depends on JS, I wouldn’t recommend anyone use the script if they care about how the layout looks for non-JS users.
@David – While I appreciate the sentiment, I have the feeling that implementing this in a browser would be significantly harder to do. :)
And I too would love to see some experimental browser implementation. I suspect the two big reasons there’s nothing yet is that the spec’s still too much in flux (there’s several inconsistencies in the current version), and, as mentioned, it’s probably a pretty complicated system to implement.
-
06.
Yes, I find js solutions that flicker your screen annoying. JS rounded corners, the first time that I saw how it flickers my page I dumped the script and implemented a css-based solution. Same with this one. Tell me a corporate page that uses these solutions. Nobody uses them on big websites exactly for this reason.
Don’t get me wrong, I would love to implement this on all the websites that I create from now on, it would be like the holy grail. But not in this form.
Please, try with hiding the body, that FOUC’s ruining it all.
-
07.
I would say that at the moment this is a tool for discovering what the module is capable of; the spec is currently immature and may change, so I would be wary of using this on a production site.
-
08.
@Buguletzu – Latest version now removes the FOUC-like effect when you run $.templateLayoutShowOnReady() (before DOM loads). See examples at http://a.deveria.com/csstpl/
-
09.
-
10.
OK, in IE doesn’t work anymore. I can haz IE support pretty pls? ;;)
User Agent: Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 5.1; Trident/4.0; .NET CLR 2.0.50727; .NET CLR 3.0.4506.2152; .NET CLR 3.5.30729)
Message: Could not get the display property. Invalid argument.
Line: 12
Char: 12949
Code: 0
URI: http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js -
11.
And if you make-it work in IE6, you truly are our savior.
-
12.
@Buguletzu – D’oh! I’ll see what I can do. :)
-
13.
Okay, V1.1.3 is available and fixes the IE issues. Also the demos seem to work in IE6, except for some minor margin/padding issues. That may just be related to the default styles in IE6, not sure.
Also, you may want to report future bugs on the blog post at http://a.deveria.com/?p=236
-
14.
-
15.
-
16.
I would say that at the moment this is a tool for discovering what the module is capable of; the spec is currently immature and may change, so I would be wary of using this on a production site.
-
17.
-
18.
-
19.
Hey thank you for sharing, I can’t wait to try it to my website, I will redesign my website and try it with CSS3!
Many thanks again!
Respect, Liviu A. -
20.
I guess new Safari supports HTML 5 and CSS3. And Mozilla Firefox upcoming versions from 3.6 will be supporting too as I’ve heard 3.6 Aplha 1 supports them.
Correct my if I’m wrong !
P.S: Beautiful Site, specially Navigation.
-
21.
Editing above comment, I mean Sidebar, not navigation*
-
22.
-
01.
