аудио при наведении курсора в jQuery

Question

аудио при наведении курсора в jQuery

0

Таким образом, у меня есть страница с изображением, которое невозможно щелкнуть благодаря некоторому отличному jQuery-коду. И у меня есть автозапуск, но я хочу, чтобы звук whisking каждый раз, когда кто-то наводил на них движущиеся изображения.

<!DOCTYPE html>
<html>
<head>
<title>Calculations</title>
<link href="style" rel="stylesheet">
<script src="https://code.jquery.com/jquery-1.11.0.min.js"></script>
</head>
<body>
    <div class="top">
        <audio controls autoplay>
        <source src="trombone2.wav" type="audio/wav">
        Your browser does not support the audio element.
        </audio>    

        <p>
            Our calculations show that your monitor is shitty, we advise you wipe the crap off your monitor preventing you from seeing anything that isn't blindingly bright. If that doesn't seem to make a difference click on the turd to run the adjustment algorithm.
        </p>
    </div>
        <a href="calc.html"> <img src="poop.png" width="100" height="100" alt="Grey Square" id="img" />

<script>
jQuery(function($) {
$('#img').mouseover(function() {
    var dWidth = $(document).width() - 100, // 100 = image width
        dHeight = $(document).height() - 100, // 100 = image height
        nextX = Math.floor(Math.random() * dWidth),
        nextY = Math.floor(Math.random() * dHeight);
    $(this).animate({ left: nextX + 'px', top: nextY + 'px' });
});   
});   
</script>
</body>
</html>

newby JP 06 май 2014, в 05:30

Источник

0

вам не хватает той части, где вы задаете вопрос :)
Josh Engelsma 06 май 2014, в 02:50
0

упс, так что я не уверен, как закодировать звуковой эффект. Я чувствую, что это должно быть jQuery, но я действительно не знаю, как написать этот материал :(
newby JP 06 май 2014, в 02:52
0

взгляните на эту ссылку ... stackoverflow.com/questions/8489710/…
Josh Engelsma 06 май 2014, в 02:55
0

проблема не в щелчке, а в наведении мыши, если вы загрузите мою страницу, вы увидите, как она прыгает, прежде чем вы сможете щелкнуть ее. Это шутка ... так что звук расстроит пользователя, потому что он уходит, прежде чем он получит шанс щелкнуть по нему. - если вы неверно истолковали ссылку, которую вы мне прислали.
newby JP 06 май 2014, в 03:02

Показать ещё 2 комментария

Теги:

jquery

html

audio

mouseover

1 ответ

Ещё вопросы

вам не хватает той части, где вы задаете вопрос :)
упс, так что я не уверен, как закодировать звуковой эффект. Я чувствую, что это должно быть jQuery, но я действительно не знаю, как написать этот материал :(
взгляните на эту ссылку ... stackoverflow.com/questions/8489710/…
проблема не в щелчке, а в наведении мыши, если вы загрузите мою страницу, вы увидите, как она прыгает, прежде чем вы сможете щелкнуть ее. Это шутка ... так что звук расстроит пользователя, потому что он уходит, прежде чем он получит шанс щелкнуть по нему. - если вы неверно истолковали ссылку, которую вы мне прислали.

JRulle · Accepted Answer · 2014-05-06T01-11-00.000Z

<script>
    var snd1 = new Audio("swish.mp3");  //1
    $(document).ready(function(){  //2
      $("#img").mouseover(function(){  //3
        var dWidth = $(document).width() - 100, // 100 = image width
            dHeight = $(document).height() - 100, // 100 = image height
            nextX = Math.floor(Math.random() * dWidth),
            nextY = Math.floor(Math.random() * dHeight);
        $(this).animate({ left: nextX + 'px', top: nextY + 'px' });
        snd1.play();   //4
        snd1.currentTime=0;   //5
      });
    });
</script>

1 первая строка создает аудио-объект JS

2 часть document.ready ждет, пока DOM не будет создан, чтобы настроить прослушиватель событий

3 Функция mouseover работает как ожидалось - устанавливает прослушиватель событий mouseover на #img

4.play() воспроизводит звук

5.currentTime = 0 переупорядочивает звук в начале для следующего использования