Sponsor: The CSS Anthology
The CSS Anthology: 101 Essential Tips, Tricks & Hacks (external link)
Blog Entry
DOM Layout Effects
Published on the 19th of March 2005
CSS3 is said to offer a variety of new functionality in making spectacular designs, but until then people all around are developing ways to bridge the gaps. I first ran across this layout effect in Alex's design blog (external link), I figured that I would share this interesting use of DOM.
Alessandro Fulciniti has developed a way of making rounded corners without the use of images, but rather a DOM effect. He uses cascading block elements to create the smooth corners. When the script doesn't run, you just don't have the borders (quite simple!).
Alessandro Fulciniti is also kind in providing a pretty solid guide (external link) in how he created this rounded effect. It provides all the source code needed for this DOM effect. You can also view some examples (external link) to see it in action.
With the rise of DOM predicted in 2005 we can already see it being more widely used in this post-CSS period. I personally am going to pick back up some JavaScript and see what I can do with the interesting techniques of DOM.
Comments
-
Frans (external link) (19 Mar 2005 7:26)
Well, nothing is wrong with Javascript, however the current opinion on it (which I share) is that it should only be used for behaviour, or in other words, if Javascript is disabled, the page should still be perfectly usable, just a little less pretty.
-
Ethan Poole (external link) (19 Mar 2005 18:36)
That's one nice thing about this layout effect. If it doesn't run then you just don't have the smooth corners, which isn't too bad looking. But in cases where you are required for JS to be enabled you've misinterpreted the use of JavaScript.
We on Lowter use JavaScript to dynamically insert a style sheet to simplify the layout in a small screen. Even though without it the page looks fine, it looks better when the main content is given more room.
So you just have to use JS when necessary and make sure you don't rely on it too much.
Sponsor: Songbird Media Player
Desktop web player, a digital jukebox, and web browser mash-up. (external link)
