Примеры:
Наведите на иконку
Нажмите на иконку
Установка:
Подключаем скрипт loudlinks.min.js в конце страницы.
Применение:
На нужный нам тег добавляем класс loud-link-hover для проигрывания звука при наведении и loud-link-click при клике
Далее в этот тег добавляем дата атрибут
1 |
data-sound="/folder/sound" |
Где sound это название mp3 и/или ogg файла
1 2 |
<div data-sound="/folder/sound" class="loud-link-click">Нажмите</div> <div data-sound="/folder/sound" class="loud-link-hover">Наведите</div> |
Звуковые файлы sound.mp3 и sound.ogg находятся в корневой папке folder
Автор скрипта loudlinks.rocks
при наведение сразу не срабативат пока не кликнеш потом работает вот ошибка Uncaught (in promise) DOMException: The play() request was interrupted by a call to pause()
Точно не уверен, но скорее всего это браузеры ставят ограничения.
У меня в хроме и мозиле все норм (правда не помню, делал ли я какие доп. разрешения для него).
Если мы запускаем музыку по ховеру, то можно открыть страницу ночью и без вашего клика оно заорет.
Уж не знаю, на сколько это нужно, вы можете кликнуть в никуда и оно все равно заорет, но гугл орал по этому поводу вроде, что мол нехорошо запускаться медийкам автоматом.
Здравствуйте!
Прошу привести пример когда сработает if ( audioSrc.indexOf('{{type}}') > 0 ):
точнее сказать каким будет audioSrc при этом?
Не могу понять.
Скрипт смешного "позабавимся 🙂 " работает по наведению только после любого клика. Покажите пожалуйста где этот первый клик обрабатывается в коде. Все обыскал...
Это скорее всего браузер блокирует. У меня и в хроме и лисе нормально ховер работает.
Поищите в инете как обойти блокировку "воспроизведение треков без ведома юзера"
Это хорошо, значит скрипт не при чем :). Правда, кроме Edge у меня все остальные 4 браузера работают только с первым кликом. В принципе, пустяк, можно разок и кликнуть.
Вопрос напрямую к статье не относится, лишь косвенно, но чувствую что автор в теме.
Вопрос: можно ли задать окончание проигрывания кусочка в файле, начало можно, это как я понял "currentTime"? Есть ли такой параметр для конца проигрывания(не всего файла, а кусочка)?
А для чего такие сложности?
Данный скрипт просто создает аудио тег при нажатии или ховере и запускает его.
currentTime нужна для стопа
Да это я понимаю...Хороший сайт у Вас, приятный.
Зделайте пожалуйста пример
Он же есть 🙂
Саша, приветик! всё работает, но выводит такую ошибку в консоль:
Uncaught (in promise) DOMException
У тебя кстати тоже. Это неопасно ?
Юзаю Хром, последняя версия
в понедельник 🙂
сегодня ну никак ....
Непойманные обещания переводится ваша ошибка 🙂
А как говорил мой дед - Работает - не трогай!
А как мой прадед - не опасно 🙂
Хаха)))
Ладно ладно))
Кстати, это происходит потому что как бы что-то, в общем хроме авто-воспроизведение треков без ведома юзера нечто такое что является ошибкой)) Данное явление при ховер, при клике ничего. Ну в в принципе да)) Работает - не трогай)) Это верно))
Спасибо за прекрасный скрипт!
Здравствуйте у меня не получается.Вот код:
<div data-sound="/folder/sound" class="loud-link-hover">Наведите</div>
Дело в том что я хочу вставить свой звук,например мелодию.
Тут нужно смотреть на то как вы подключили скрипт и загрузили на сайт звуковые файлы (в какую папку).
Дайте ссылку на сайт, постараюсь помочь
Позабавилась ;-(
Навтыкала на сайт звуков, что жуть какая-то стала...
Пришлось удалять ;-(
С такими вещами нужно аккуратнее )