Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [JavaScript] jQuery - efekt płynnego przejścia przy hover
Forum PHP.pl > Forum > Przedszkole
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ć?
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/
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 smile.gif
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 nerdsmiley.png
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.