I'm currently trying to get JWPlayer to play audio files when the user interface is hidden. It works great for video (plays audio from video), but for some reason, when I use the same method to play audio files, nothing happens when I press the user play button.
This code plays the sound from the video as expected:
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="jwplayer/jwplayer.js"></script> </head> <body> <div style="display: none;"> <div id="player"></div> </div> <input onclick="jwplayer('player').play();" type="button" value="Play the hidden video!!!" /> <script type="text/javascript"> jwplayer("player").setup({ levels: [ { file: "VideoTest001.mp4" }, { file: "VideoTest001.ogv" }, { file: "VideoTest001.webm" } ] }); </script> </body> </html>
This code plays the sound of the sound (but the player is visible):
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="jwplayer/jwplayer.js"></script> </head> <body> <div id="player"></div> <input onclick="jwplayer('player').play();" type="button" value="Play the hidden audio!!!" /> <script type="text/javascript"> jwplayer("player").setup({ levels: [ { file: "AudioTest.mp3" }, { file: "AudioTest.wav" } ] }); </script> </body> </html>
As soon as I add <div style="display: none;">...</div> , the sound no longer plays.
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="jwplayer/jwplayer.js"></script> </head> <body> <div style="display: none;"> <div id="player"></div> </div> <input onclick="jwplayer('player').play();" type="button" value="Play the hidden audio!!!" /> <script type="text/javascript"> jwplayer("player").setup({ levels: [ { file: "AudioTest.mp3" }, { file: "AudioTest.wav" } ] }); </script> </body> </html>
Can anyone help? I would like the sound to play when the JWPlayer user interface is hidden.
source share