HTML5 Player with Flash fallback for non supporting browsers.
How do I make an html5 player with flash fallback for non supporting browsers.?
Implementing the HTML5 Audio Tag and the MP3 Player will fallback to the Flash player in those browsers that don't support the audio tag nor can play mp3 in it.. What is a html5 player with flash fallback for non supporting browsers.? How do you make a html5 player with flash fallback for non supporting browsers.? This script and codes were developed by Stan Williams on 08 September 2022, Thursday.
HTML5 Player with Flash fallback for non supporting browsers. Previews
HTML5 Player with Flash fallback for non supporting browsers. - Script Codes HTML Codes
<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>HTML5 Player with Flash fallback for non supporting browsers.</title> <link rel="stylesheet" href="css/style.css">
</head>
<body> <h3 id="toc-player-default">Player with default controls</h3> <audio id="audio_with_controls" controls> <source src="https://soundcloud.com/stanwmusic/lasttrail-mp3" type="audio/mpeg" /> <source src="https://ia601903.us.archive.org/29/items/StanWilliamsLastTrail/StanWilliamsLastTrail.ogg" type="audio/ogg" /> <object class="playerpreview" type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20"> <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /> <param name="bgcolor" value="#222222" /> <param name="FlashVars" value="mp3=https://soundcloud.com/stanwmusic/lasttrail-mp3" /> <embed href="http://flash-mp3-player.net/medias/player_mp3_mini.swf" bgcolor="#085c68" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="mp3=https://soundcloud.com/stanwmusic/lasttrail-mp3" /> </object>
</audio><p> </p>
<div id="default_player_fallback"></div> <h3 id="toc-player-custom">Player with customized controls</h3> <audio id="audio"> <source src="https://soundcloud.com/stanwmusic/lasttrail-mp3" type="audio/mpeg" /> <source src="https://ia601903.us.archive.org/29/items/StanWilliamsLastTrail/StanWilliamsLastTrail.ogg" type="audio/ogg" /> <object id="flash_obj" class="playerpreview" type="application/x-shockwave-flash" data="http://flash-mp3-player.net/medias/player_mp3_mini.swf" width="200" height="20"> <param name="movie" value="http://flash-mp3-player.net/medias/player_mp3_mini.swf" /><param name="bgcolor" value="#222222" /> <param name="FlashVars" value="mp3=https://soundcloud.com/stanwmusic/lasttrail-mp3" /> <embed href="http://flash-mp3-player.net/medias/player_mp3_mini.swf" bgcolor="#222222" width="200" height="20" name="movie" align="" type="application/x-shockwave-flash" flashvars="https://soundcloud.com/stanwmusic/lasttrail-mp3" /> </object> </audio> <div id="custom_player_fallback"></div> <div id="player" style="display: none"> <button onClick="document.getElementById('audio').play()">Play</button> <button onClick="document.getElementById('audio').pause()">Pause</button> </div>
</script> <script src="js/index.js"></script>
</body>
</html>
HTML5 Player with Flash fallback for non supporting browsers. - Script Codes CSS Codes
h3 { font-family: 'Droid Sans', Arial, sans-serif; font-size: 14px;
}
body {background-color:#b0c4de;} HTML5 Player with Flash fallback for non supporting browsers. - Script Codes JS Codes
if (document.createElement('audio').canPlayType) { if (!document.createElement('audio').canPlayType('audio/mpeg') && !document.createElement('audio').canPlayType('audio/ogg')) { swfobject.embedSWF("http://flash-mp3-player.net/medias/player_mp3_mini.swf", "default_player_fallback", "200", "20", "9.0.0", "", {"mp3":"https://soundcloud.com/stanwmusic/lasttrail-mp3"}, {"bgcolor":"#222222"} ); swfobject.embedSWF("http://flash-mp3-player.net/medias/player_mp3_mini.swf", "custom_player_fallback", "200", "20", "9.0.0", "", {"mp3":"https://soundcloud.com/stanwmusic/lasttrail-mp3"}, {"bgcolor":"#222222"} ); document.getElementById('audio_with_controls').style.display = 'none'; } else { // HTML5 audio + mp3 support document.getElementById('player').style.display = 'block'; }
} if (document.createElement('audio').canPlayType) { if (!document.createElement('audio').canPlayType('audio/mpeg') && !document.createElement('audio').canPlayType('audio/ogg')) { swfobject.embedSWF("http://flash-mp3-player.net/medias/player_mp3_mini.swf", "default_player_fallback", "200", "20", "9.0.0", "", {"mp3":"https://soundcloud.com/stanwmusic/lasttrail-mp3"}, {"bgcolor":"#222222"} ); swfobject.embedSWF(http://flash-mp3-player.net/medias/player_mp3_mini.swf", "custom_player_fallback", "200", "20", "9.0.0", "", {"mp3":"https://soundcloud.com/stanwmusic/lasttrail-mp3"}, {"bgcolor":"#222222"} ); document.getElementById('audio_with_controls').style.display = 'none'; } else { // HTML5 audio + mp3 support document.getElementById('player').style.display = 'block'; } }
/*
Modified by: Stan Williams http://stans-songs.com and http://stanwilliamsmusic.com
MP3 sample is Last Trail by: Stan Williams: http://www.stanwilliamsmusic.com and is licensed under http://creativecommons.org/licenses/by-nc-nd/3.0/
Attribution - NonCommercial - NoDerivatives
Download Last Trail.MP3 free here:
https://soundcloud.com/stanwmusic/lasttrail-mp3
Download the .ogg file free here:
https://archive.org/details/StanWilliamsLastTrail
------------------------------------------
Code samples are licensed under the Apache 2.0 License. http://www.apache.org/licenses/LICENSE-2.0
Flash MP3 player is from neolao production
http://flash-mp3-player.net/
Download the MP3 player free here: http://flash-mp3-player.net/players/mini/download/
MP3 player license:
The player is under the Creative Commons BY SA http://creativecommons.org/licenses/by-sa/3.0/deed.fr
and MPL 1.1 license: https://www.mozilla.org/MPL/
You can use the player without citing the author.
originalcode author:
https://www.html5rocks.com/en/tutorials/audio/quick/
*/
| Developer | Stan Williams |
| Username | Stanssongs |
| Uploaded | September 08, 2022 |
| Rating | 3 |
| Size | 3,484 Kb |
| Views | 34,408 |
Do you need developer help for HTML5 Player with Flash fallback for non supporting browsers.?
Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!
Stan Williams (Stanssongs) Script Codes
| Name | Size |
| 3D Book | 7,405 Kb |
| Background Image Slideshow Menu | 2,226 Kb |
| Responsive Company Page | 9,666 Kb |
| Cursor following menu demo | 8,080 Kb |
| Blog Page | 4,805 Kb |
| Pure CSS3 breadcrumb navigation, pixel perfect | 3,958 Kb |
| Record Player with CSS3 Anims and HTML5 Audio | 3,404 Kb |
| Mouse Position Background Focus Effect | 4,213 Kb |
| A Pen by Stan Williams | 6,706 Kb |
| Off-Canvas LeftResponsive Page with hidden music player widget in left sidebar | 5,692 Kb |
Create amazing web content with AI!
Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!
Similar Scripts & Codes
| Name | Username | Size |
| TweenMax transformOrigin Bubble | Nicolund | 2,209 Kb |
| A Pen by Mike Otis | Mikeotis | 3,185 Kb |
| CSS3 Button Examples | Volusion | 3,377 Kb |
| Search Box in Content Moves to Fixed Header | Chriscoyier | 2,768 Kb |
| Mesmerizing octopus | Jllodra | 3,549 Kb |
| A Pen by John Malc | F789gh | 1,420 Kb |
| 3D Text in Sass | Bookcasey | 2,766 Kb |
| RollOver Effect 2 | Lmack90 | 2,162 Kb |
| CSS3 Animated buttons | Cguillou | 3,737 Kb |
| Hover Animation from UNIQLO | Insprd | 3,772 Kb |
Do you want hide your ip address?
Surf anonymously, prevent hackers from acquiring your IP address, send anonymous email, and encrypt your Internet connection. High speed, ultra secure, and easy to use. Instant setup. Hide Your IP Now!