ugrás a tartalomhoz

CSS: Using a list item to create a star rater

Hojtsy Gábor · 2005. Aug. 31. (Sze), 12.58
Csillagos értékelés CSS-sel formázott listával
 ■
1

adjacent sibling

Jano · 2005. Aug. 31. (Sze), 14.37
Ezt meg lehetne oldani szépen a + kivalsztoval is.

alapbol minden li-nek a kijeloletlen csillag a hattere

ul:hover-re az osszes csillag hattere kijeloltre valtozik
kiveve:
ul:hover li:hover + li,
ul:hover li:hover + li + li,
ul:hover li:hover + li + li + li,
ul:hover li:hover + li + li + li + li
ahol megint csak kijeloletlen hatter kell.
2

IE

mdesign · 2005. Aug. 31. (Sze), 15.44
Hello!

Merő kiváncsiságból megcsináltam Janó féle módszerrel, mivel sokkal szimpatikusabb lenne, de IE alatt nem megy.
Esetleg vmi ötlet?

http://www.martondesign.com/test/ratingstars/
3

hmm nem irtam oda

Jano · 2005. Szep. 1. (Cs), 00.03
Ugylatszik nem irtam oda, hogy termeszetesen IE-ben nem megy mert nem ismeri se a linken kivuli hovert, se az adjacent sibling kivalasztot.
4

Tök jó:)

Jano · 2005. Szep. 1. (Cs), 00.07
Annyit lehetne még rajta ahogy nézem finomitani, hogy a linkek, illetve li-k pontosan olyan magasak legyenek mint az ul, hogy ne forduljon olyan elo, hogy a link feletti resben az ul-re mar raer az eger, a lista elemre meg meg nem, es igy felvillan az osszes csillag.

Valami rémlik, hogy mintha lenne olyan kivalaszto is ami az osszes utana vonatkozora igaz, de ez sajnos nem jut eszembe.

Update:
Megtaláltam. CSS3-ban lesz olyan, hogy nem közvetlenül követő elem: Indirect adjacent combinator és ez volt az a menü amiről a dolog eszembe jutott: A menu effect using the adjacent combinators ('+' and '~') and hover pseudo-class
5

IE 7 támogatja majd

mdesign · 2005. Szep. 7. (Sze), 06.23
http://www.quirksmode.org/blog/archives/2005/09/css_hacks_are_s_1.html