So verwenden Sie JQuery, um einen Bildumdrehungseffekt zu erzielen-HTML-Kenntnisse-php.cn

So verwenden Sie JQuery, um einen Bildumdrehungseffekt zu erzielen

藏色散人

Freigeben： 2018-12-19 09:48:50

Original

7698 Leute haben es durchsucht

jquery kann die jQuery-Methode attr() verwenden, um einen Bildumdrehungseffekt zu erzielen. Verwenden Sie dann die Methode jquery attr(), um die Bildquelle (dh das src-Attribut des Tags ) zu ändern, um den Bildumdrehungseffekt zu erzielen.

So verwenden Sie JQuery, um einen Bildumdrehungseffekt zu erzielen

Im Folgenden stellen wir Ihnen die Methode von jquery zur Erzielung des Bildspiegeleffekts anhand einfacher Codebeispiele vor.

Das Codebeispiel lautet wie folgt:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>jquery实现图片翻转效果示例</title>
    <style>
 .card{
            margin: 30px;
 }
    </style>
    <script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
    <script>
 $(function () {
            $("img").click(function(){
                // 改变图片的src属性
 $(this).attr("src", "./images/1.jpg");
 });
 });
 </script>
</head>
<body>
<div class="card">
    <img src=".images/2.jpg" alt="Poker Card">
</div>
</body>
</html>

Nach dem Login kopieren

Hier definieren wir zunächst ein Bild (2.jpg) und fügen diesem Bild dann ein Klickereignis hinzu, das ausgelöst wird, wenn dieses Bild angezeigt wird angeklicktattr()-Methode , ändert das src-Attribut des Bildes, d. h. es ersetzt ein anderes Bild (1.jpg).

Der endgültige Bildumdrehungseffekt ist wie folgt:

So verwenden Sie JQuery, um einen Bildumdrehungseffekt zu erzielen

attr()-Methode kann den Attributwert des ausgewählten Elements festlegen oder zurückgeben Element. Abhängig von den Parametern der Methode ist auch die Funktionsweise unterschiedlich.

Hinweis: Wenn diese Methode zur Rückgabe von Attributwerten verwendet wird, wird der Wert des ersten übereinstimmenden Elements zurückgegeben.

Wenn diese Methode zum Festlegen von Attributwerten verwendet wird, werden ein oder mehrere Attribut/Wert-Paare für das übereinstimmende Element festgelegt.

In diesem Artikel geht es um die spezifische Implementierungsmethode von jquery, um den Bildumdrehungseffekt zu erzielen. Ich hoffe, dass er für Freunde in Not hilfreich ist.

Das obige ist der detaillierte Inhalt vonSo verwenden Sie JQuery, um einen Bildumdrehungseffekt zu erzielen. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!