PrawyKuba
#webdev #webdevhelp


Mam taki kod. Chcę dodać hover do obrazka, że po najechaniu na niego kursorem wypełnia się kolorem (obrazek, nie cała kolumna col-md-4 + obrazek). Zależy mi na takiej strukturze tj. col-md-4 => img, bo mogę sobie to łatwo wyrównać text-centerem, chyba, że jestem głupi i można to wyśrodkować inaczej ( ͡° ͜ʖ ͡°).

Proszę o pomoc Mireczky.
1
  • Najlepsze
  • Wszystkie komentarze
Rst00
@epi: no jak da obrazek w jeszcze dodatkowy kontener to ok ;)
2
Rst00
@PrawyKuba: no i w czym masz problem? .img-1 img:hover
1
epi
@PrawyKuba: background na obrazku działa, ale jest zasłonięty przez ten obrazek właśnie ;)
podmieniaj na hoverze też src na jakiegoś jednopixelowego przezroczystego gifa lub pnga, najlepiej zakodowanego w base64

ewentualnie ostyluj sobie :after od obrazka odpowiednio, żeby przykrywał obrazek kolorem
1
Rst00
@epi: przecież :after na obrazku nie zadziała.
1
epi
@Rst00: to może być dodatkowy div ;)
1
epi
@PrawyKuba: coś w tym stylu raczej: http://stackoverflow.com/questions/2182716/is-it-possible-to-set-the-equivalent-of-a-src-attribute-of-an-img-tag-in-css

aczkolwiek podejście z czymś, co przykryje obrazek kolorem będzie działać w wiekszej liczbie przeglądarek
1
epi
1
PrawyKuba
@epi: Bardzo Ci dziękuję za pomoc, teraz już wszystko rozumiem. :)
1
PrawyKuba
@Rst00: Próbowałem, działa z borderem, blurem, ale z colorem, backgroundcolorem, backgroundem nie.
0
tomeczek11
@PrawyKuba: masz jakiegoś cssa?
0
PrawyKuba
@tomeczek11: Mam. Ten od bootstrapa i customowy. Przy czym w tym customowym jak próbuję zwykłym .img-1 img:hover { background-color: } to nie działa.
0
PrawyKuba
@epi: Nie wiem czy dobrze rozumiem ;). Powinno to wyglądać w ten sposób? http://pastebin.com/yz549KsL
0