[CSS] Jak nie używając JavaScript zrobić, żeby ciało tabelki pozostawało niewidoczne (nagłówek widoczny) dopóki użytkownik nie najdzie na nią kursorem?
4:29Thu, 29 March 2007
table
{
width: 85%;
margin: auto;
}
table:hover td /* Zadziała dla wszystkich komórek(!) tabeli, gdy użytkownik najedzie kursorem na dowolny element(!) tabeli */
{
display: table-cell; /* Ważna instrukcja: wyświetla komórki ciała tabeli w sposób specyficzny dla komórek tabeli ;) */
}
table td
{
display: none; /* domyślnie komórki tabeli, będące w jej "ciele" są nie widoczne */
}
Przy czym powyższy kod nie działa w przeglądarce Internet Explorer - ciało tabelki zawsze będzie ukryte, nawet jeśli najedziemy na nie kursorem. Dla IE musimy niestety pozostawić włączoną widoczność tabelek na stałe (albo skorzystać z JavaScript). Pokaże jak zastosować hack, dzięki któremu użytkownicy IE będą widzieć tabelki, a użytkownicy innych przeglądarek będą mogli cieszyć się pokazywaniem zawartości tabelki na życzenie:
table
{
width: 85%;
margin: auto;
}
table:hover td /* Zadziała dla wszystkich komórek(!) tabeli, gdy użytkownik najedzie kursorem na dowolny element(!) tabeli */
{
display: table-cell; /* Ważna instrukcja: wyświetla komórki ciała tabeli w sposób specyficzny dla komórek tabeli ;) */
}
table td
{
display: none; /* domyślnie komórki tabeli, będące w jej "ciele" są nie widoczne */
* display: table-cell; /* Tą linijkę zinterpretuje tylko IE */
}
Póki co brak pytań w FAQ.Skomentuj
Aby zamieścić komentarz, proszę włączyć JavaScript - niestety roboty spamujące dają mi niezmiernie popalić.
Komentarze czytelników
Nie ma jeszcze żadnych komentarzy.