Toggle Bild in reinem Javascript

-2

Ich habe jetzt ein Spieler-Symbol, das beim Spielen in das Pause-Symbol wechselt. Ich verwende diesen Code es für die Änderung:Toggle Bild in reinem Javascript

<script> 
     var onImg= "img/play.svg"; 
     var offImg= "img/pause.svg"; 
    </script>

aber es geht nur in eine Richtung und nicht zurück auf das Play-Symbol zurück, wenn noch einmal angeklickt. Wie kann ich das archivieren? Ich kann nur jQuery-Code finden, aber ich möchte eine Lösung haben, die nicht von irgendwelchen Bibliotheken abhängig ist.

Link zu Demo: http://mortenhjort.dk/synchub/v2/ (erste Abdeckung arbeitet mit Audio)

Quelle

2016-10-06 Morten Hjort

folgt Können Sie uns den Code zeigen, dass die tatsächliche Hin- und Herschalten tut? –

Noch besser bist du in der Lage, einen schnellen und schmutzigen Snippet zu knacken? .. – Keith

Von dieser Seite hat er einen Inline-Klick auf das Bild mit: 'this.src = this.src == offImg? onImg: offImg; 'Aber aus Gründen der einfachen Beantwortung wäre ein Schnipsel hilfreich. – DBS

einen Blick auf diese:

var on = "http://webneel.com/wallpaper/sites/default/files/images/04-2013/15-beach-sea-photography.preview.jpg"; 
 
var off = "https://s13.postimg.org/lzdaqr6fr/15_beach_sea_photography_preview_Convert_Image.jpg"; 
 
var state = false; 
 
var img = document.getElementById("img"); 
 

 
img.onclick = function(){ 
 
\t if(state){ 
 
    \t img.src = off; 
 
    state = false; 
 
    } 
 
    else{ 
 
    \t img.src = on; 
 
    state = true; 
 
    } 
 
}

<img src="http://webneel.com/wallpaper/sites/default/files/images/04-2013/15-beach-sea-photography.preview.jpg" id="img">

Die Lösung ist das gleiche, wenn Sie das ändern müssen spielen Symbol mit einer Pause Symbol ... hoffe, es hilft :)

Quelle

2016-10-06 10:00:32

Sie können Bild src Attribut mit reinen JavaScript-Funktion ändern

img.setAttribute('src',"http://cdn-images.deezer.com/images/cover/fd198aa0a511e33d42c787a364434962/400x400-000000-80-0-0.jpg")

Quelle

2016-10-06 10:03:50

Toggle Bild in reinem Javascript

Antwort

Verwandte Themen