Javascript воспроизводит звук при наведении. остановить и сбросить при наведении

function EvalSound(soundobj) {
    var thissound=document.getElementById(soundobj);
    thissound.currentTime = 0;  
    thissound.Play();
}

function StopSound(soundobj) {
    var thissound=document.getElementById(soundobj);
    thissound.Stop();
}

Это мой код для воспроизведения аудиофайла,

onmouseover="EvalSound('sound1')" onmouseout="StopSound('sound1')"

В настоящее время он работает над наведением, однако, когда я возвращаюсь к изображению, которое он воспроизводит, он не возвращается к началу, он продолжает воспроизведение


person user2081357    schedule 17.02.2013    source источник
comment
Как вы размещаете свой звук? У меня была такая же проблема раньше из-за странной ошибки в SimpleHTTPServer Python...   -  person Xymostech    schedule 18.02.2013
comment
Только не забудьте дать пользователю возможность отключить звук :-)   -  person Maksym Kozlenko    schedule 18.02.2013
comment
я только что вставил такой файл ‹embed src=sound/audiofile.m4a autostart=false width=1 height=1 id=sound1 enablejavascript=true›   -  person user2081357    schedule 18.02.2013


Ответы (3)


Тег — это старый способ встраивания мультимедиа. Вам действительно следует использовать новые теги HTML5

Вот простой пример, который воспроизводит аудиофайл при наведении курсора и останавливает его при выходе из него.

HTML:

<p onmouseover="PlaySound('mySound')" 
    onmouseout="StopSound('mySound')">Hover Over Me To Play</p>

<audio id='mySound' src='http://upload.wikimedia.org/wikipedia/commons/6/6f/Cello_Live_Performance_John_Michel_Tchaikovsky_Violin_Concerto_3rd_MVT_applaused_cut.ogg'/>

Javascript:

function PlaySound(soundobj) {
    var thissound=document.getElementById(soundobj);
    thissound.play();
}

function StopSound(soundobj) {
    var thissound=document.getElementById(soundobj);
    thissound.pause();
    thissound.currentTime = 0;
}

Для получения дополнительной информации ознакомьтесь с руководством MDN по встраиванию аудио и видео.

person zevdg    schedule 17.02.2013
comment
Кроме того, я бы рекомендовал поставить thissound.currentTime = 0; в StopSound() вместо EvalSound(). Таким образом, если вам когда-либо понадобится приостановить звук, функция EvalSound все равно будет работать должным образом. - person zevdg; 18.02.2013
comment
‹сценарий› function EvalSound(soundobj) { var thissound=document.getElementById(soundobj); этот звук.текущее время = 0; этот звук.Воспроизвести(); } function StopSound(soundobj){ var thissound=document.getElementById(soundobj); этот звук.Стоп(); } ‹/script› ‹embed src=sound/soundfile.mv4 autostart=false width=1 height=1 id=sound1 enablejavascript=true› - person user2081357; 18.02.2013
comment
‹сценарий› function EvalSound(soundobj) { var thissound=document.getElementById(soundobj); этот звук.Воспроизвести(); } function StopSound(soundobj){ var thissound=document.getElementById(soundobj); это.текущее время = 0; это.пауза(); } ‹/script› ‹embed src=sound/sound.m4a autostart=false width=1 height=1 id=sound1 enablejavascript=true› ‹a href=# onmouseover=EvalSound('sound1') onmouseout=StopSound('sound1' )› ‹img src=images/img.png /› ‹/a› - person user2081357; 18.02.2013
comment
Ах, вы используете тег ‹embed›. Я настоятельно рекомендую переключиться на тег «аудио». Это предпочтительный способ встроить аудио на вашу веб-страницу. Я добавил пример кода в свой ответ выше. - person zevdg; 19.02.2013

У меня был тот же вопрос о запуске и остановке звука. Я использую jQuery без каких-либо других плагинов. Мой код предназначен для mousedown и mouseup, но его можно изменить на другие действия.

HTML

<div class="soundbutton">
   cool wind sound
</div>
<audio id="wind-sound" src="wind-sound/wind.mp3">

Javascript

$('.soundbutton').on('mousedown', function () {     
    playWind();                                  //start wind sound
})
.on('mouseup', function () {                    
    stopWind();                                  //stops the wind sound
});


// my full functions to start and stop

function playWind () {                           //start wind audio
  $('#wind-sound')[0].volume = 0.7;
  $('#wind-sound')[0].load();
  $('#wind-sound')[0].play();
}
function stopWind () {                           //stop the wind audio
  $('#wind-sound')[0].pause();
  $('#wind-sound')[0].currentTime = 0;           //resets wind to zero/beginning
}
person josephjguerra    schedule 22.07.2014

<html>

<script>
function stopAudio() {                      
player.pause();
player.currentTime = 0;           
}
</script>


<body>
<audio id="player" src="(place audio here)"></audio>

<div> 
<button onclick=" stopAudio()">Stop</button>
</div>

</body>
</html>

// Конец Примечание: вы должны посмотреть на свой аудио идентификатор, так как мой называется «плеер», поэтому он не работает, посмотрите на свой css и ваш html очень близко к вашим строкам. Еще одна вещь, с которой вы должны быть осторожны, это ваша функция вызова, поскольку моя указана как stopAudio(), ваша может называться по-другому. Функция работает только с css, если вы правильно используете метод вызова.

person Micheal Wade Harrison    schedule 22.10.2016