Napisao sam jednostavan css kod za promenu slike pri prelasku misem (hover) medjutim ono sto zelim da postignem je da i kada kliknem promeni se slika ( jedna je crno-bela a druga u boji- pravim neki meni za kategorije)... to nebi bio nikakav problem kada bi se samo jednom menjala slika ali kako da napravim da se svakim klikom ove dve slicice-ikonice smenjuju...
Kod je:
Kôd:
<!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=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
#kat1 {
background-image:url(ikoniceKategorije/07.jpg);
width:30px;
height:30px;
float:left;
}
#kat1:hover {
background-image:url(ikoniceKategorije/07h.jpg);
}
#kat2 {
background-image:url(ikoniceKategorije/06.jpg);
width:30px;
height:30px;
float:left;
}
#kat2:hover {
background-image:url(ikoniceKategorije/06h.jpg);
}
#kat3 {
background-image:url(ikoniceKategorije/05.jpg);
width:30px;
height:30px;
float:left;
}
#kat3:hover {
background-image:url(ikoniceKategorije/05h.jpg);
}
#kat4 {
background-image:url(ikoniceKategorije/04.jpg);
width:30px;
height:30px;
float:left;
}
#kat4:hover {
background-image:url(ikoniceKategorije/04h.jpg);
}
#kat5 {
background-image:url(ikoniceKategorije/03.jpg);
width:30px;
height:30px;
float:left;
}
#kat5:hover {
background-image:url(ikoniceKategorije/03h.jpg);
}
#kat6 {
background-image:url(ikoniceKategorije/02.jpg);
width:30px;
height:30px;
float:left;
}
#kat6:hover {
background-image:url(ikoniceKategorije/02h.jpg);
}
#kat7 {
background-image:url(ikoniceKategorije/01.jpg);
width:30px;
height:30px;
float:left;
}
#kat7:hover {
background-image:url(ikoniceKategorije/01h.jpg);
}
#div {
width:220px;
height:30px;
overflow:hidden;
}
</style>
</head>
<body>
<div id="div">
<div id="kat1"></div>
<div id="kat2"></div>
<div id="kat3"></div>
<div id="kat4"></div>
<div id="kat5"></div>
<div id="kat6"></div>
<div id="kat7"></div>
</div>
</body>
</html>
a demo na
www.pluspon.com/kategorije.html
verovatno je mnogo bolje koristiti class umesto ID...
Hvala unapred!