[thelist] Style suggestions

Robert Vreeland vreeland at studioframework.com
Fri Aug 18 12:21:29 CDT 2006

Hello list,
I'm playing around with some mouse over effects on text links (no images) to
simulate a more 'traditional' image based rollover. The rational is while I
might have Photoshop and can re-slice new images to update the menus, most
of my clients do not. So I want to be able to provide a method where they
just need to update a list of links ( how the list is generated is not
important at this point).
How I have it working now is:
A function called buildbg() gets a list of all anchors, if it finds an
anchor with the class name 'navtext' it creates and appends a span node next
to the anchor. The newly created span has the class 'navtext-shadow'
assigned, which positions the span behind with a one pixel offset. The
function also adds the mouse over functions need to modify the new span's
style properties (in this instance I change the text color).
Note, there is some additional code in there to disable the non-JavaScript
ready style sheet (for those who do not have JavaScript enabled - otherwise
the sub menus are hidden and show up as part of the rollover effect)
Ok, that said, I've got the scripting working and an initial go at the
styles. Now I'm looking for some suggestions for 'better' looking styles for
the rollover effects. 
To view the test page :
JavaScript file located at http://studioframework.com/sowrides/sowrides.js
style sheets are at http://studioframework.com/sowrides.css (non-javascript
and http://studioframework.com/sowrides_js.css 
Feel free to use the script.
Robert Vreeland

More information about the thelist mailing list