Mehrere Implementierungsmethoden von onmouseover und onmouseout, um Bilder zu wechseln, wenn die Maus hinein- und herausbewegt wird

Dieser Artikel stellt Ihnen verschiedene Implementierungsmethoden von Onmouseover und Onmouseout vor, um Bilder zu wechseln, wenn die Maus hinein- und herausbewegt wird. Ich hoffe, dass er für Sie hilfreich ist.

Es ist sehr üblich, die Maus hinein und heraus zu bewegen, um Bilder zu wechseln. Lassen Sie uns also darüber sprechen, wie Sie es implementieren:

Die erste Methode, die auch die einfachste ist, kann implementiert werden in html

<img class="img" src="img/dongtai.png" onmouseover="this.src=&#39;img/HBuilder.png&#39;" onmouseout="this.src=&#39;img/dongtai.png&#39;"/>

Stellen Sie zuerst ein Bild ein, schreiben Sie dann das Bild und verschieben Sie es hinein und heraus.

Die zweite Methode, js-Ersetzung

<img name="image1" src="img/dongtai.png" onmouseover="mouseOver()" onmouseout="mouseOut()" />

function mouseOver() {
	document.image1.src = "img/HBuilder.png"
}

function mouseOut() {
	document.image1.src = "img/dongtai.png"
}

Schreiben Sie die Methode zum Ersetzen des Bildes in js und rufen Sie sie in HTML auf.

Wenn Sie onmouseover und onmouseout nicht verwenden, können Sie auch so schreiben

<p class="bg"></p>

rrree

Diese drei Methoden können den Effekt erzielen, dass die Maus in das Bild hinein und aus ihm heraus bewegt wird Es ist ganz einfach? Du kannst es versuchen!

Zusammenfassung: Das Obige ist der gesamte Inhalt dieses Artikels, ich hoffe, dass er für das Studium aller hilfreich sein wird. Weitere verwandte Tutorials finden Sie unter JavaScript-Video-Tutorial!

Verwandte Empfehlungen:

PHP-Video-Tutorial zum Gemeinwohltraining

JavaScript-Grafik-Tutorial

JavaScript Online-Handbuch

Das obige ist der detaillierte Inhalt vonMehrere Implementierungsmethoden von onmouseover und onmouseout, um Bilder zu wechseln, wenn die Maus hinein- und herausbewegt wird. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!