Autor Zpráva
Freezerr
Profil *
Zdravím,

snažím se vyřešit přechod jednoho obrázku do druhého po najetí myší na prvek a po vyjetí myší zase vrácení na původní obrázek. Momentálně mám tento kód, ovšem ten změní obrázek ihned bez přechodu.

    $('.img').hover(
        function() {
            $(this).attr('src','images/obrazek.png').fadeIn(300);
        },
        function() {
            $(this).attr('src','images/obrazek2.png').fadeIn(300);
        }
    );
MartinP_
Profil *
Atribut src nelze animovat. Udělal bych to tak, že bych po najetí vytvořil nový <img>, ten napozicoval nad ten aktuální, zprůhlednil (opacity: 0;), načetl do něj nový obrázek a pak animací postupně zneprůhlednil (opacity: 1;).
Keeehi
Profil
Velmi jednoduše by to šlo třeba takto. Není to však stoprocentní, pokud přejedu přes obrázek moc rychle, zasekne se v hover stavu a nevrátí se zpátky. Vyřešit to samozřejmě jde (i když nevím jak v jQuery) ale je to o dost složitější.
Freezerr
Profil *
Používám bootstrap a mám tam napozicovány texty přes ten obrázek přes JS, aby se to přizpůsobovalo velikosti obrázku. A když použiju řešení od MartinP, tak se mi to celé rozhodí. Ale to je jedno, já si s tím zkusím ještě nějak pohrát.
KryVosa
Profil
Šlo by to ještě čistě přes styly, pomocí pseudo-elementu :hover.

Vaše odpověď

Mohlo by se hodit

Neumíte-li správně určit příčinu chyby, vkládejte odkazy na živé ukázky.
Užíváte-li nějakou cizí knihovnu, ukažte odpovídajícím, kde jste ji vzali.

Užitečné odkazy:

Prosím používejte diakritiku a interpunkci.

Ochrana proti spamu. Napište prosím číslo dvě-sta čtyřicet-sedm:

0