Autor Zpráva
Petrnson
Profil
Ahoj,
na stránky bych chtěl umístit hodnocení pomocí hvězdiček, na internetu jsem nalezl návod od Henry Hoffman. Tato ukázka sama o sobě funguje skvěle a je poměrně nenáročná na kód.

Ale pokud chci tu ukázku rozšířit, aby zobrazovala stávající hodnocení, vyskytují se problémy. V tomto případě když jedu myší zleva doprava, je vše správně, naopak zprava do leva nikoli, jelikož hvězdičky nezešednou. Živá ukázka

Poradíte mi prosím?

Upravené HTML
<ul class="rating">
	<li><a href="#" title="1 Star">1</a></li>
    <li><a href="#" title="2 Stars" class="aktivni">2</a></li>
    <li><a href="#" title="3 Stars">3</a></li>
    <li><a href="#" title="4 Stars"">4</a></li>
    <li><a href="#" title="5 Stars">5</a></li>
</ul>


Upravené CSS
* {
padding:0;
margin:0;
list-style:none;
}

ul.rating{
background:url(images/star.jpg) bottom;
height:21px;
width:115px;
overflow:hidden;
}

ul.rating li{
display:inline
}

.rating li a {
display:block;
width:23px;
height:21px;
float:left;
text-indent:-9999px;
position:relative;
}

.rating a.aktivni {
background:url(images/star.jpg) top;
width:115px;
margin-left:-92px;
position: static;
}

.rating a:hover {
background:url(images/star.jpg) center;
width:115px;
margin-left:-92px;
}

.rating a:active {
background-position:top;
}
fandaa
Profil
Petrnson:
Přidáno trochu JS. Možná by to šlo i jinak, ale je to funkční: http://lab.fandaa.name/scripts/stars/
Petrnson
Profil
fandaa:
Děkuji za tip, popřemýšlím o tom, zda to použiji. Jelikož z počátku jsem chtěl pouze HTML a CSS.

Vaše odpověď

Mohlo by se hodit


Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm: