Autor Zpráva
cheli
Profil
Na internetu jsem si našel návod na hodnocení (třeba článků) obrázky. Všechno fungovalo, tak jak mělo. Základní obrázek jedné hvězdy rozšířen na 5 hvězd a hover stav hvězd, to je v pořádku Ale v IE7 se neukazoval aktivní stav hvězd (hodnocení), který tam je stanoven pevnou šířkou obrázku. V návodu to funguje. Ale i když si to nakopíruju, jen si tam dam svoje obrázky s jejich velikostí, tak to proste v IE nejde. Odkaz na návod je zde.

A tady je kód, se kterým to nejde.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<style>
/* styles for the star rater */
.star-rating{
list-style:none;
margin: 0px;
padding:0px;
width: 125px;
height: 25px;
position: relative;
overflow:hidden;
background: url(hvezda.jpg) top left repeat-x;
}
.star-rating li{
padding:0px;
margin:0px;
width:25px;
height:25px;
/*\*/
float: left;
/* */
}
.star-rating li a{
display:block;
width:25px;
height: 25px;
line-height:25px;
text-decoration: none;
text-indent: -9000px;
z-index: 20;
position: absolute;
padding: 0px;
overflow:hidden;
}
.star-rating li a:hover{
background: url(hvezda-hover.jpg) left bottom;
z-index: 2;
left: 0px;
border:none;
}
.star-rating a.one-star{
left: 0px;
}
.star-rating a.one-star:hover{
width:25px;
}
.star-rating a.two-stars{
left:25px;
}
.star-rating a.two-stars:hover{
width: 50px;
}
.star-rating a.three-stars{
left: 50px;
}
.star-rating a.three-stars:hover{
width: 75px;
}
.star-rating a.four-stars{
left: 75px;
}
.star-rating a.four-stars:hover{
width: 100px;
}
.star-rating a.five-stars{
left: 100px;
}
.star-rating a.five-stars:hover{
width: 125px;
}
.star-rating li.current-rating{
background: url(hvezda-active.jpg) left center;
position: absolute;
height: 25px;
display: block;
text-indent: -9000px;
z-index: 1;
}

/* remove halo effect in firefox */
a:active{
outline: none;
}

</style>
</head>
<body>

<ul class='star-rating'>
<li class='current-rating' style='width:105px;'> Currently 3.5/5 Stars.</li> <!--TOHLE SE TAM PROSTE NEZOBRAZÍ-->
<li><a href='#' title='1 star out of 5' class='one-star'>1</a></li>
<li><a href='#' title='2 stars out of 5' class='two-stars'>2</a></li>
<li><a href='#' title='3 stars out of 5' class='three-stars'>3</a></li>
<li><a href='#' title='4 stars out of 5' class='four-stars'>4</a></li>
<li><a href='#' title='5 stars out of 5' class='five-stars'>5</a></li>
</ul>

</body>
</html>

Dovedl by to někdo opravit nebo upravit tak, aby to šlo ve všech prohlížečích. Jde o to, že ty 3 obrázky, které tam jsou uvedeny, se musí zobrazovat na stejném řádku, aby se překrývaly. A to mi právě nejde. Předem děkuji za pomoc

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: