Как запустить звук после загрузки страницы и изменить функцию щелчка ⇐ Jquery
-
Anonymous
Как запустить звук после загрузки страницы и изменить функцию щелчка
Что работает:
На моей странице есть несколько кнопок (по блокам: b1, b2, b3), и когда я нажимаю на них, они плавно исчезают в собственном звуковом цикле. Если я нажму кнопку «Назад домой», воспроизводимый звук плавно затухнет. Аудио-тег создается динамически.
Мои коды jQuery:
$(document).ready(function() { вар audioElement = document.createElement('audio'); audioElement.id = 'аудиоплеер'; audioElement.loop = true; audioElement.addEventListener('завершено', функция() { this.currentTime = 0; это.играть(); }, ЛОЖЬ); audioElement.addEventListener('завершено', функция() { это.пауза(); }, истинный); $('.b1').click(function(){ audioElement.setAttribute('src', 'media/jazzy.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.b2').click(function(){ audioElement.setAttribute('src', 'media/violin.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.b3').click(function(){ audioElement.setAttribute('src', 'media/esoteric.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.back-home').click(function(){ FadeOutAudio (audioElement, 1000); }); функция FadeInAudio (аудио, FadeTime) { аудио.объем = 0; // устанавливаем громкость на минимум вар шагов = 500; вар StepTime = FadeTime/шаги; var audioIncrement = parseFloat(audio.volume + («0,00» + шаги)); вар таймер = setInterval(функция(){ audio.volume += audioIncrement; консоль.очистить(); console.log(audio.volume); if (audio.volume >= 0.99){ //если уже слышно, останавливаем цикл консоль.очистить(); console.log("1"); аудио.объем = 1; ClearInterval (таймер); } }, StepTime); } функция FadeOutAudio (аудио, FadeTime) { аудио.объем = 1; // устанавливаем громкость на максимум вар шагов = 150; вар StepTime = FadeTime/шаги; вар audioDecrement = audio.volume/steps; вар таймер = setInterval(функция(){ audio.volume -= audioDecrement; консоль.очистить(); console.log(audio.volume); if (audio.volume
Что работает:
На моей странице есть несколько кнопок (по блокам: b1, b2, b3), и когда я нажимаю на них, они плавно исчезают в собственном звуковом цикле. Если я нажму кнопку «Назад домой», воспроизводимый звук плавно затухнет. Аудио-тег создается динамически.
Мои коды jQuery:
$(document).ready(function() { вар audioElement = document.createElement('audio'); audioElement.id = 'аудиоплеер'; audioElement.loop = true; audioElement.addEventListener('завершено', функция() { this.currentTime = 0; это.играть(); }, ЛОЖЬ); audioElement.addEventListener('завершено', функция() { это.пауза(); }, истинный); $('.b1').click(function(){ audioElement.setAttribute('src', 'media/jazzy.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.b2').click(function(){ audioElement.setAttribute('src', 'media/violin.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.b3').click(function(){ audioElement.setAttribute('src', 'media/esoteric.mp3'); аудиоЭлемент.играть(); FadeInAudio (audioElement, 1000); }); $('.back-home').click(function(){ FadeOutAudio (audioElement, 1000); }); функция FadeInAudio (аудио, FadeTime) { аудио.объем = 0; // устанавливаем громкость на минимум вар шагов = 500; вар StepTime = FadeTime/шаги; var audioIncrement = parseFloat(audio.volume + («0,00» + шаги)); вар таймер = setInterval(функция(){ audio.volume += audioIncrement; консоль.очистить(); console.log(audio.volume); if (audio.volume >= 0.99){ //если уже слышно, останавливаем цикл консоль.очистить(); console.log("1"); аудио.объем = 1; ClearInterval (таймер); } }, StepTime); } функция FadeOutAudio (аудио, FadeTime) { аудио.объем = 1; // устанавливаем громкость на максимум вар шагов = 150; вар StepTime = FadeTime/шаги; вар audioDecrement = audio.volume/steps; вар таймер = setInterval(функция(){ audio.volume -= audioDecrement; консоль.очистить(); console.log(audio.volume); if (audio.volume
Мобильная версия