Tutorial
Click on thumbnailed images to enlarge
To enable this script just include the lines below in the head section.
To use the script you can call the function using mouse event functions like onClick, onMouseOver/onMouseOut, and so on. For example (using the onClick event):
or using the onMouseOver/onMouseOut function
NOTE: This script is best for DIV, and other sorts of container elements (TABLE elements, etc).
<script type="text/javascript">
/* Works on any browser :)
Leave this credit area please?
Bertoni Moretti @ bottie.org */
function colEl(eltgt,bgc,col){ // the function name and the empty variables are created in this line
eltgt.style.backgroundColor = bgc; // this changes the background colour
eltgt.style.color = col; // this changes the colour
}
</script>
/* Works on any browser :)
Leave this credit area please?
Bertoni Moretti @ bottie.org */
function colEl(eltgt,bgc,col){ // the function name and the empty variables are created in this line
eltgt.style.backgroundColor = bgc; // this changes the background colour
eltgt.style.color = col; // this changes the colour
}
</script>
To use the script you can call the function using mouse event functions like onClick, onMouseOver/onMouseOut, and so on. For example (using the onClick event):
<a href="javascript://" onClick="colEl(object_name, 'background_colour', 'colour');">CLICK TO CHANGE COLOUR</a>
or using the onMouseOver/onMouseOut function
onMouseOver="colEl(object_name, 'background_colour_before', 'colour_before');"
onMouseOut="colEl(object_name, 'background_colour_after', 'colour_before');"
onMouseOut="colEl(object_name, 'background_colour_after', 'colour_before');"
NOTE: This script is best for DIV, and other sorts of container elements (TABLE elements, etc).
Tutorial Comments
No comments yet. Be the first one to comment!
