• Najnowsze pytania
  • Bez odpowiedzi
  • Zadaj pytanie
  • Kategorie
  • Tagi
  • Zdobyte punkty
  • Ekipa ninja
  • IRC
  • FAQ
  • Regulamin
  • Książki warte uwagi

[CSS] właściwość 'content' nie podmienia obrazka w Internet Explorer :-(

Object Storage Arubacloud
0 głosów
199 wizyt
pytanie zadane 27 lipca 2015 w HTML i CSS przez Sebastian Fojcik Nałogowiec (43,040 p.)
Nie będę się dużo rozpisywał, bo przykładowa strona, którą napisałem dla Was wyjaśnia wszystko. Problem polega na tym, że po najechaniu myszką na obrazek powinien się on podmienić na inny. Tak się dzieje w Operze, ale w IE 11 nie. Przetestujcie to na swoich przeglądarkach.

Byćmoże da się zrealizować ten sam efekt w nieco inny sposób? Dziękuję i pozdrawiam.

Link do stronki (1 plik HTML i 2 obrazki): http://speedy.sh/SPH9U/strona.zip

2 odpowiedzi

+1 głos
odpowiedź 27 lipca 2015 przez Eimens Maniak (69,240 p.)
Na upartego tak właśnie można to zrobić, jest też druga opcja, która wygląda następująco :)

http://codepen.io/ReVieR/pen/BNqgeO
komentarz 27 lipca 2015 przez Sebastian Fojcik Nałogowiec (43,040 p.)
Przekształciłem trochę tamten kod, aby podmieniał obrazek na obrazek. Niestety mnie interesuje ułożenie w lini 4 obrazków, gdzie po najechaniu na jakiś podmieni się na inny. Ze sposobem, który podałeś nie jestem w stanie ich ułożyć w jednej linii. Ze względu na nieszczęsny "position: absolute" wydaje się to niemożliwe.

A nawet jeśli jest, to i tak już zaczyna to być zbyt skomplikowane jak na taką prostą czynność - podmiana obrazka.
+1 głos
odpowiedź 27 lipca 2015 przez Comandeer Guru (602,380 p.)
Jeśli nie podmienia, to znaczy, że nie jest do końca zgodny ze specyfikacją CSS3 i należałoby zgłosić błąd.

To, czego szukasz, to tzw. efekt rollover: http://roberto.ovh.org/html-css/rollover.html

Albo jeszcze lepiej zrobić to tak, jak na mojej domowej - z css sprites. Kod dostępny tutaj: http://codepen.io/Comandeer/pen/MwPNyw
Trik polega na tym, że łączy się dwa obrazki w jeden i przesuwa o wysokość jednego (wówczas pokazuje się drugi).

Podobne pytania

+1 głos
1 odpowiedź 243 wizyt
pytanie zadane 18 maja 2016 w HTML i CSS przez Niespecjalny Gaduła (4,180 p.)
0 głosów
0 odpowiedzi 46 wizyt
pytanie zadane 7 lutego w HTML i CSS przez Piotrek2713 Mądrala (5,500 p.)
+1 głos
1 odpowiedź 177 wizyt

92,660 zapytań

141,553 odpowiedzi

319,993 komentarzy

62,028 pasjonatów

Motyw:

Akcja Pajacyk

Pajacyk od wielu lat dożywia dzieci. Pomóż klikając w zielony brzuszek na stronie. Dziękujemy! ♡

Oto polecana książka warta uwagi.
Pełną listę książek znajdziesz tutaj.

Akademia Sekuraka

Kolejna edycja największej imprezy hakerskiej w Polsce, czyli Mega Sekurak Hacking Party odbędzie się już 20 maja 2024r. Z tej okazji mamy dla Was kod: pasjamshp - jeżeli wpiszecie go w koszyku, to wówczas otrzymacie 40% zniżki na bilet w wersji standard!

Więcej informacji na temat imprezy znajdziecie tutaj. Dziękujemy ekipie Sekuraka za taką fajną zniżkę dla wszystkich Pasjonatów!

Akademia Sekuraka

Niedawno wystartował dodruk tej świetnej, rozchwytywanej książki (około 940 stron). Mamy dla Was kod: pasja (wpiszcie go w koszyku), dzięki któremu otrzymujemy 10% zniżki - dziękujemy zaprzyjaźnionej ekipie Sekuraka za taki bonus dla Pasjonatów! Książka to pierwszy tom z serii o ITsec, który łagodnie wprowadzi w świat bezpieczeństwa IT każdą osobę - warto, polecamy!

...