2016-10-06 15 views
-2

再生時に一時停止アイコンに変更されるプレーヤーアイコンが表示されるようになりました。私はそれを変更するため、このコードを使用しています:純粋なjavascriptで画像を切り替えます

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

それは一方向のみになり、またもう一度クリックしたときに戻って再生アイコンに戻りませんが。これをどのようにアーカイブできますか?私はjQueryコードしか見つけることができませんが、どのライブラリにも依存しないソリューションが必要です。デモへ

リンク:http://mortenhjort.dk/synchub/v2/(最初のカバーは、オーディオで動作します)

+1

はあなたが私たちに実際トグルを行うコードを表示することができ、次のように純粋なjavascript関数を使用して画像SRC属性を変更できますか? –

+0

素早く汚れたスニペットをノックアップすることは可能ですか? – Keith

+0

そのページから、彼はイメージにインラインonclickを持っています: 'this.src = this.src == offImg? onImg:offImg; 'しかし簡単に答えるためにはスニペットが役立つでしょう。 – DBS

答えて

1

は、このを見てみましょう:あなたは変更する必要がある場合

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">

ソリューションが同じです再生アイコン一時停止アイコン...ほしいと思っています:)

1

あなたは

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