[JavaScript] jQuery - efekt płynnego przejścia przy hover Opcje

[bahh]

Witam,

mam taki kod który zmienia jeden obrazek na drugi po najechaniu na niego myszką
http://jsfiddle.net/cvqrrw9j/

chcę jednak uzyskać tutaj efekt płynnego przejścia, tzn przejście trwa 700 milisekund

wie ktoś jak to zrobić?

Ten post edytował bahh 31.12.2014, 13:47:22

[fate]

http://www.w3schools.com/css/tryit.asp?fil...ss3_transition1
sprobuj z backgroundem zmixowac

[bahh]

pytanie, czy jeżeli w hover będzie inne tło (tzn odnośnik do innego obrazka) to zostanie to załadowane przy starcie strony, czy zacznie się ładować w trakcie najechania? Bo własnie dlatego chcę jQuery użyć, bym miał to załadowane na starcie.

[Turson]

Obrazek dla hover zostanie załadowany po najechaniu. Dlatego są czasem problemy z brakiem płynności zmienności obrazka i w takim wypadku należy załadować obrazek wcześniej

[trueblue]

http://jsfiddle.net/cvqrrw9j/2/

Ten post edytował trueblue 2.01.2015, 08:39:11

[fate]

Spróbuj ewentualnie zmixować z background position tworząc sprite'a w takim razie, wyjaśnisz mi jak to jest ze korzystając z jQuery wszystkie obrazki załadowane beda wraz ze strona? Nie udalo mi sie znaleźć informacji na ten temat

[bahh]

trueblue - przyznam że pomysł wręcz rewelacyjny w tym cssie

fate - gdyby był background position + transition to płynnie z pozycji np 0 0 przechodziłoby na 100 0 co nie dałoby efektu przenikania a przesuwania

odnośnie jQuery, sam nie wiem, aczkolwiek ze 2 lata temu gdzieś miałem kod, w którym jQuery wczytywał obrazki podczas ładowania strony, stąd to moje pytanie było u góry

[trueblue]

bahh, nic w tym rewelacyjnego, mus kiedy nie możesz mieć jednego obrazka.
Jeśli tylko jest to możliwe, trzymaj obydwie fazy w jednym obrazku/pliku.

P.S. A jeśli potrzebujesz tylko zmiany kolor<->czarno-białe, to wystarczy Ci jedna faza.

[fate]

bahh rozumiem,
zgadywałem sam nie wypróbowywałem tego