Jak zmienić obraz na wuszach w JavaScript
W tym poście pokazuje procedurę zmiany obrazu na zawisie w JavaScript.
Jak zmienić obraz na zawisie w JavaScript?
Aby zmienić obraz na zawisie, użyj „onmouseover" wydarzenie. Gdy mysz/kursor jest przenoszony przez element HTML lub jedno z jego dzieci, zdarzenie onmouseover jest wyzwalane.
Przykład 1: Zmień obraz na zawisie w JavaScript
W pliku HTML użyj znacznika, aby wyświetlić obraz na stronie internetowej. Dołącz „onmouseover„Wydarzenie, które wywoła funkcję JavaScript, gdy mysz unosi się nad obrazem:
W pliku JavaScript zdefiniuj funkcję „unosić się”Z parametrem„img". W zdefiniowanej funkcji ustaw obraz, który zostanie pokazany na zawisie:
Funkcja zawisająca (IMG)img.src = "2.jpg "
Jak widać, na wyjściu, kiedy unosimy się nad bieżącym obrazem, nagle się zmienia:
Przykład 2: Przełącz obraz na zawisie
W powyższym przykładzie obraz zmienia się, gdy mysz unosi się nad obrazem, a ten sam obraz pozostaje. Teraz, w tym przykładzie, pierwszy obraz pojawi się ponownie, gdy mysz wyprowadzi się z obrazu. Efekt ten nazywa się efektem przełączania. W tym celu użyjemy „onmouseover" I "onmouseout„Właściwości HTML:
"onmouseover”Wzywa„unosić się()”Funkcjonowanie podczas„onmouseout„Wydarzenie wywołuje funkcję„Hoverout ()”:
funkcja hoverout (IMG)img.src = "1.jpg "
Wyjście pokazuje, że obraz jest skutecznie zmieniony, gdy mysz jest nad obrazem i zmienia się, gdy mysz wychodzi z obrazu:
Chodziło o zmieniający się obraz na zawisie.
Wniosek
Aby zmienić obraz na zawisie, użyj „onmouseover" wydarzenie. Aby przełączać efekt, użyj „onmouseover”Atrybut z„onmouseout" wydarzenie. Gdy mysz/kursor jest przenoszony przez element lub jedno z jego dzieci, zdarzenie onmouseover jest wyzwalane. W tym poście zademonstrowaliśmy procedurę zmiany obrazu na zawisie w JavaScript.