BoxLib examples

This is an example box.

Code for this box

   <div class="box color1">
    <div class="content">
     <h1>BoxLib examples</h1>
     <div class="line"></div>
     This is an example box.<br />
    </div>
   </div>
   

TITLE

This is another example box using a "color2" class.

Purpose

To provide a clean and gracefully-degrading "rounded corners" box/content container design via Javascript/CSS/DOM manipulation under 5.x+ browsers

Features

• OO-style approach - lightweight reusable component-based design
• Supported in 5.x+ browsers (minus IE:mac, possibly NS6.0)
• Multiple color schemes supported via CSS
• Relatively easy structured HTML implementation
• Javascript automagically handles creation of box elements
• Degrades gracefully in older (crappier) and non-supported/capable browsers

Unintended features (bugs) + drawbacks

• Does not work under IE:mac for some reason (script avoids applying styles for the time being)
• Separate images required for each color type
• Corner images need to match body background color
• IE:win32 workaround for resizing (CSS rounding error?) - likely slows down redraw
• Occasional content reflow / sizing bug (corner images do not appear in correct positions)