This technique makes an unordered list go on in depth as much as we want. The script analyzes the list tree and applies toggle functions for expanding/collapsing child objects. Parent items, the ones we should click to expand child objects, don’t need to be wrapped inside an anchor element. Script checks for child objects and adds appropriate clickable elements. Furthermore the script adds two buttons above the list, one for expanding and one for collapsing all the elements.
There are many techniques on the web for adding folded corners to DIV containers. This one does so by using relative positioning to slightly offset a DIV to the right and bottom, so its a background image, which is a curly image, falls inline with the border of the outer DIV.
The perfect fluid width layout works on all major browsers. The layout can shrink to 780px which accommodates 800×600 resolution and also grows to 1260px for 1280×768 resolutions.
This works by placing the title of the item hotspot into the definition-term tags of your list, followed by the description in the definition-description tags. The CSS then hides the definition-term (which is really used for when CSS is disabled), as well as the definition-description (displayed upon hover of the anchor) and displays the definition description (in this case, the description of the hotspot(s) you’ve chosen for your imagemap), and absolutely positions and displays the description upon rolling over the hotspot (also defined in the CSS).
StyleMap uses valid HTML, CSS and a touch of DOM scripting to produce a visual sitemap out of an embedded definition list. The result is a functional, scalable, and above-all rapid way to produce a tree-style map for the planning stages of your project.
Works nicely for blog comment styling. Customize colors and styling to your taste from within the CSS, then simply edit the pointer tip image. Works on any background to fit with your design.
A matrix table using CSS where clicking on a cell should highlight the associated cell in the top row and left most column. This helps in establishing relationships among the information provided in the table quickly.
Candy Menu is a stylish CSS drop down menu that’s comes in six provocative color schemes – Caramel Cream, Blueberry Blast, Black Licorice, Green Apple, Grape Sensation and Raspberry Punch. You can also use it in your WordPress themes if you have the necessary expertise in theme modification.
This example changes the opacity of any image link when the mouse moves over it using the “hover:” pseudo class of CSS. Note the two different properties used to specify opacity in CSS below. In IE 5.5+, the “filter” property is used (range: 0-100), and in Mozilla/NS6+, “-moz-opacity” (range: 0-1). Both properties are proprietary, and not formally endorsed by the W3C.