[thelist] tying events and styles together in JS?

Cake cake at brothercake.com
Wed Feb 19 10:24:01 CST 2003


DHTML behaviours :)

Make a file called "hover.htc" and put this something like this in it:




<public:component>

<attach event="onmouseover" handler="highlight" />
<attach event="onmouseout" handler="lolight" />

<script type="text/javascript">

	function highlight() {
		element.style.backgroundColor="yellow";
		}

	function lolight() {
		element.style.backgroundColor="white";
		}

</script>

</public:component>



Then you attach it to the TR in your stylesheet:



tr.hover { behavior:url(hover.htc); }



http://msdn.microsoft.com/workshop/author/behaviors/howto/creating.asp
has more info. Of course it will only work in IE5 and IE6 ... but that
doesn't matter - Mozilla, Opera 7, Safari and Konqueror can do this in
pure CSS ;) The only 'serious' DHTML browser that misses out is the mac
version of IE5.




James





-----Original Message-----
From: thelist-admin at lists.evolt.org
[mailto:thelist-admin at lists.evolt.org] On Behalf Of Tom Dell'Aringa
Sent: 19 February 2003 16:15
To: thelist at lists.evolt.org
Subject: [thelist] tying events and styles together in JS?


Heres a question,

Say I have a page where I want every table row to have a onmouseover and
onmouseout event, in order to change the color of the row - so I am
doing this:

<tr onmouseover="this.className='on';"
onmouseout="this.className='off';" class="trHighLight">Stuff</tr>

If this is a page with 30 rows, thats a lot of code. If I have 10 pages
that have this behavior, you get the picture.

Is there some way either in JS or otherwise that I can specify this
behavior for a TR instead of each time in the actual tag? It would be
even better if I could do it only for the TRs where a certain class is.

Not sure if this is pie in the sky hoping or not..

Tom

=====
var me = tom.pixelmech.webDeveloper();

http://www.pixelmech.com/
http://www.maccaws.com/
[Making A Commercial Case for Adopting Web Standards]

__________________________________________________
Do you Yahoo!?
Yahoo! Shopping - Send Flowers for Valentine's Day
http://shopping.yahoo.com
--
* * Please support the community that supports you.  * *
http://evolt.org/help_support_evolt/

For unsubscribe and other options, including the Tip Harvester
and archives of thelist go to: http://lists.evolt.org
Workers of the Web, evolt !





More information about the thelist mailing list