ciao, ti ho preparato un piccolo esempio di come lo farei io il sistemino..
premetto che è molto semplice e sicuramente qualcun' altro qui potrebbe fare molto meglio di me...
la particolarità di questo metodo è solo che tu agli oggetti puoi assegnare anche diverse classi, le quali magari gestiscono altre cose e queste rimangono inalterate..
spero possa esserti di aiuto 
codice:
<html>
<head>
<meta http-equiv="Content-Language" content="it">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>switchstyle</title>
</head>
<style>
.blue
{
color: yellow;
background-color: blue;
}
.red
{
color: black;
background-color: red;
}
.green
{
color: maroon;
background-color: green;
}
.test
{
font-family: verdana;
}
.test1
{
font-family: Georgia;
font-size: 24px;
}
</style>
<script>
default_color='blue';
function switchstyle(newcolor)
{
var coll=document.getElementsByTagName('*');
for (var n=0; n < coll.length; n++)
{
if (coll[n].className.match(default_color) != null)
{
var newclass="coll[n].className=coll[n].className.replace(/"+default_color+"/,'"+newcolor+"')";
eval(newclass);
}
}
default_color=newcolor;
}
</script>
<body>
<table border="1" width="100%">
<tr>
<td colspan="2" height="100" valign="top" class="blue test1">head</td>
</tr>
<tr>
<td width="23%" height="500" valign="top" class="blue test">menu content</td>
<td width="75%" height="500" valign="top">
blue
red
green
</td>
</tr>
<tr>
<td colspan="2" width="30" height="40" valign="top" class="blue">foot</td>
</tr>
</table>
</body>
</html>
Rispondi quotando
