Ciao a tutti, sono nuovo e google mi ha portato qui...
Ho visto che ci sono moltissime persone qui che sanno esattamente quello che fanno... quindi vi chiedo aiuto!
Ho "preso in prestito" dei pulsanti da qui:
http://www.sohtanaka.com/web-design/...e-css-buttons/
e li ho messi in una tabella (codice qui sotto). Fin qui facile, funzionano e sono carini.
Ora, io vorrei fare in modo che al click il pulsante cambi colore (da verde a rosso), e al click successivo torni come era...
Sono certo che per molti di voi sarà una banalità, io ci sto provando da mezza giornatae non ne esco!
Grazie a tutti per il vostro aiuto!
Marco
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
margin: 0;
padding: 10px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 14px;
}
.btn {
float: left;
clear: both;
background: url(images/btn_left.png) no-repeat;
padding: 0 0 0 10px;
margin: 5px 0;
}
.btn a{
float: left;
height: 40px;
background: url(images/btn_stretch.png) repeat-x left top;
line-height: 40px;
padding: 0 10px;
color: #fff;
font-size: 1em;
text-decoration: none;
}
.btn a:hoover {
float: left;
height: 40px;
background: url(images/btn_stretch.png) repeat-x left top;
line-height: 40px;
padding: 0 10px;
color:#F00
font-size: 1em;
text-decoration: none;
}
.btn span {
background: url(images/btn_right.png) no-repeat;
float: left;
width: 10px;
height: 40px;
}
.btn_green { background-color: green; }
.btn_red { background-color: red; }
.btn_orange { background-color: orange; }
.btn_try { background-color: #002c85; }
.clear {
clear: both;
}
</style>
</head>
<body><table width="100%" border="2" cellspacing="1" cellpadding="1">
<tr>
<td><table width="100%" border="0" cellspacing="1" cellpadding="1">
<tr>
<td><div class="btn btn_green">  1<span></span></div><div class="clear"></div></td>
<td><div class="btn btn_green">  2<span></span></div><div class="clear"></div></td>
<td><div class="btn btn_green">  3<span></span></div><div class="clear"></div></td>
<td><div class="btn btn_green">  4<span></span></div><div class="clear"></div></td>
<td><div class="btn btn_green">  5<span></span></div><div class="clear"></div></td>
</tr>
</tr>
</table>
</body>
</html>
Rispondi quotando
