짤팁 : 이미지 2개 토글버튼 오디오 > 그누보드5 팁자료실

그누보드5 팁자료실

짤팁 : 이미지 2개 토글버튼 오디오 정보

짤팁 : 이미지 2개 토글버튼 오디오

본문


<audio id=myAudio src="mp3경로" loop></audio>
<img id=myImg style=cursor:pointer;display:block>
<script>
onImg = "재생이미지경로";
offImg = "정지이미지경로";
function playAudio() {
    myImg.src = offImg;
    myAudio.play();
}
function pauseAudio() {
    myImg.src = onImg;
    myAudio.pause();
}
myImg.onclick = function() {
    myAudio.paused ? playAudio() : pauseAudio();
}
myImg.src = onImg;
</script>
추천
8
  • 복사

댓글 10개

이미지의 경우 하나는 이퀄라이저 등이 음직이는 gif 로 만들고 하나는 고정이미지로 만들면 효과는 더욱 큽니다.
© SIRSOFT
현재 페이지 제일 처음으로