Perfection or Vanity

Rollover, śpieszę z wyjaśnieniem, jest to efekt podmiany obrazka na inny, gdy znajdzie się nad nim kursor myszy. Co to jest CSS rollover i czym się różni od swojego skryptowego przodka już pisałem i jeśli nie słyszeliście o tej metodzie, to możecie zechcieć się z nią teraz zapoznać.

Tyle słowem wstępu. Rollover jaki zaprezentowałem dawniej był całkiem sprytny, nie wymagał czekania na wczytanie drugiego obrazka, ale nie był doskonały. Jego ułomność wynikała z zachłyśnięcia się możliwościami obrazków teł - wciskalibyśmy je wszędzie. Jednak i one stwarzają kłopoty:

W jaki sposób stworzyć na stronie bloki, które będą zawierały automatyczne numerowanie i do tego numerki będą w środku i z prawej strony? Można by użyć generowanej zawartości oraz liczników albo wstawić jakimś skryptem. Co powiecie jednak na rozwiązanie najprostsze - lista numerowana <ol/> oraz trochę CSS:

Działa w Firefoksie 1.5 oraz Internet Explorerze 6. Opera robi mi znowu na złość, podobnie jak wcześniej gdy używałem tylko marginesów. Szkoda. :(

Podczas boomu na Flasha zapomniano, że wykorzystując parę animowanych GIFów i właściwości tła w stylach CSS można wykonać interesujące, proste efekty. Otwierano pirackiego Flash MX-a i klikano menu, przyciski. Bo się tak ładnie świecą. Cóż. Tutaj przygotowałem parę alternatyw.

Wszędzie w Internecie widzi się przykłady poradników jak zrobić etykietkę narzędziową dla hiperłącza w CSS. Przykład sprowadza się do ukrycia elementu linka i jego pokazaniu po nakierowaniu myszą, w czym pomaga stan :hover.

Przykładowa składnia:

1. <a class="tooltip" href="opis.html">Opis linka<dfn>Tooltip</dfn></a>

Na stronach fanowskich często spotykamy się ze spoilerami, czyli dokumentami, recenzjami albo komentarzami, które odkrywają szczegóły fabuły książki, filmu bądź innego medium. Na co porządniejszych z tych witryn wszystkie miejsca w tekście, gdzie pojawiają się spoilery, mają zwykle kolor tła. Jest to rozwiązanie doraźne - osoba chcąca przeczytać taki tekst musi go zaznaczyć myszką.

Zamierzam prowadzić cykl artykułów przybliżających wykorzystanie elementów HTML-a i operacji na nich stylami zgodnie ze standardami. Założenie jest takie, aby wykonanie zwyczajnych części strony nie odstraszało i powiedzmy, nie pchało ku tabelkom i tagzupie. Aby semantyczny kod kojarzył się z poezją, a nie dziwactwami technicznych ludzi.

O ile przypisy dolne w książkach mnie zawsze denerwowały, bo wyrywały z wartkiego potoku wyrazów, to wersje elektroniczne można o wiele bardziej uatrakcyjnić.