PDA

View Full Version : Condense onmouseover & onmouseout attributes ???


hater
07-10-2006, 06:43 AM
Hello everyone,

this is my first post & not sure if i am putting it in the right spot... anyways does anyone know of a way to shorten the attribute names onmouseover & onmouseout???

I would like to wrap these to something with a smaller name say "omo" for "onmouseover", I would like to condense the code shown below, I have it repeated significantly throughout my code, about 1000 cells, mapping those attributes to a shorter name would save significant amount in my code...

is there a way to do this through a css style sheet for each <td> or through a javascript wrapper function???

<td>
<a href="test1.php"><img src="images/image1.jpg" onmouseover="function1(parameters1);" onmouseout="otherfunction();"/></a>
</td>
<td>
<a href="test2.php"><img src="images/image2.jpg" onmouseover="function1(parameters2);" onmouseout="otherfunction();"/></a></td>
<td>
<a href="test3.php"><img src="images/image3.jpg" onmouseover="funtion1(parameters3);" onmouseout="otherfunction();"/></a>
</td>

Masterslave
07-10-2006, 09:30 AM
I thought that is not possible (correct me if I'm wrong).

Bill Posters
07-10-2006, 09:38 AM
Use js to loop through them and add the events that way.
Helps keep things tighter, properly separated and easier to maintain.

e.g.,
function setImgs() {

var imgEls = document.getElementsByTagName('img');
for (var i=0, tImg; tImg=imgEls[i]; i++) {
tImg.onmouseover = function() { function1() }
tImg.onmouseout = function() { function2() }
}

}

You can use a combination of the DOM and/or className and/or id attributes to focus the function on a more specific (sub)set of images.
How best to actually do this depends on your existing/surrounding markup.