Autor | Zpráva | ||
---|---|---|---|
cheli Profil |
#1 · Zasláno: 9. 7. 2009, 20:11:14 · Upravil/a: cheli
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 |
||
Časová prodleva: 15 let
|
0