HTML - Add The Word "play" To Play Audio File?
Is it possible to simply add the word "Play" to an html web page,
which, when selected, would play an audio file stored in my web page directory? If possible, can you provide the code? i'm guessing the web visitor would simply need audio player software on his/her computer? Which is on most if not all computers today. Correct? thanks. Similar TutorialsHi, I have an album which has 5 to 6 audio files(wma). I used checkboxes to list the audio files. I want to select one or more of the audio files by ticking in checkbox and play those selected using a button. How can I do that using html? I see that many music sites use this functionality, but not sure how to code this using html? Can someone help? Note: I have already hosted the audio files and have the web url for all the wma files. How to play an audio file in HTML? _______________ When I put in my code, it works just fine on my Mac in Safari or Firefox. However, when I test it on a PC in Explorer 7 or 8 it starts playing automatically. This is what my code looks like: Code: <audio controls="controls"> <source src="/media/GOAL.wav" type="audio/wav" autostart="false"/> <embed height="100px" width="200px" src="/media/GOAL.wav" /> </audio> The "autostart" code I put in apparently is wrong. Is there a way to fix this so it does not autostart in Explorer and any other browers? Thx. I'm having a really odd problem with the html audio player. It looks fine if I don't click the play button, but the moment I click the play button, it would disappear and reappear around 15-20 pixels lower. Here is my code for a simple audio player: HTML: Code: <div id="audioplayer"> <span class="eightonesmall" id="audiotext"> Background music control</span> <audio controls="controls"> <source src="music/liangzhuhualuowuhui.ogg" type="audio/ogg" /> <source src="music/liangzhuhualuowuhui.mp3" type="audio/mp3" /> </audio> </div> CSS: Code: body { margin: 0; padding: 0; width: 100%; height: 100%; overflow:hidden; background-image:url(../pictures/drawings/backgrounds/menubackgroundbubbles.png); background-position:center; background-attachment:fixed; } #audiotext { vertical-align:middle; color:#CCCCCC; } #audioplayer { position:fixed; top:10px; right:10px; border:3px double #FFF; height:30px; } The same problem occurs for an audio player that I've set to hidden, and will appear if I click an arrow and disappear if I click another arrow. It hides it and re-appears fine, just the player shifts down 15-20 pixels if I click play... HTML: Code: <div class="collapsearrow"> <img src="pictures/thumbnails/musicboxbuttons/collapsearrow.png" alt="collapsearrow" onclick="document.getElementById('song1').style.visibility='visible';"/>Liangzhu </div> <div id="song1" style="visibility:hidden;"> <img src="pictures/thumbnails/musicboxbuttons/contractarrow.png" alt="contractarrow" onclick="document.getElementById('song1').style.visibility='hidden';"/> <audio id="musicboxplayer" controls="controls"> <source src="music/liangzhuhualuowuhui.ogg" type="audio/ogg" /> <source src="music/liangzhuhualuowuhui.mp3" type="audio/mp3" /> </audio> </div> CSS: Code: #musicboxplayer { position:relative; width:86px; height:25px; } .collapsearrow { float:left; } #song1,#song2,#song3,#song4 { width:150px; float:left; } Does anyone know what's causing this? Thanks. I was hoping someone could clue me in as to whether or not this would be possible. I'm thinking it isn't but I need to make sure. I'd like to provide a file for people to download on my website, but when they click on the link and the download window appears I don't want them to have the option of opening it. Is it possible to only give them the option to save the file? Sounds incredibly unlikely but I gotta know. I used code below to paly mp3 file but none of them working. Why? < A HREF = "MYMP3.MP3".....> OR, <EMBED SRC= "MYMP3.MP3" ...> How to play sound file right away by clicking withoud download file first? Hi there in new here so please be nice haha ok i want a Mp3 file which is located in the same directory as my web page file to play in the background of my web page saved on my computer. i have tried loads of different codes, but to no success. I am using firefox browser 3.0.9 version. I created the html webpage using notepad. I have installed apple's quicktime as this website said so: http://kb.mozillazine.org/Background...doesn%27t_play Here is my code, please could somebody tell me where i am going wrong: Code: <html> <head> <title>My webpage!!!!!!!!!</title> </head> <body> <object data="music.mp3" type="application/x-mplayer2" width="0" height="0"> <param name="florida.mp3" value="music.mp3"> <param name="autostart" value="1"> <param name="playcount" value="true"> </object> </body> </html> Any help would be great many thanks and kind regards Jackie x http://americancreek.com/inmedia/treatycreek/ When you click on this link, the articulate file is supposed to start playing automatically, but it does not. If you click refresh, the file starts to play. Also, if you click "next" and then go back, it starts to play. It's only when you clear your cache and click the link again, is when it does not play and just sits there. Hi everyone. I am new to this forum and have very basic HTML knowledge. I've set up a page at http://www.freudiansliprecording.com/thelastsupper which, as it is coded now, automatically plays a goofy 5 second MP3 audio file when the page loads. What I would like to do is have the page randomly choose between 2 or three different of these very short MP3 audio clips and play one of them (and only one of them) when a visitor first comes to this page. Can anyone here recommend a way for me to do this? I do not want a visible player for this randomly chosen clip. Thank you all very, very much in advance for your help Cheers, Kevin I have a project written in ASP.NET under Visual Studio 2005 with C#. I am also using Infragistics objects for .NET Advantage 2007. In my page to attach resources to a record I have written a browser and am displaying previously chosen resources here. But when I click the upload button the page opens a new window (which is not a dialog window, but a normal one) which is exactly the same as my dialog window. How can this possibly happen? Can anyone help me? A customer gave me a Word doc that they want turned into a printer friendly web page. I understand that there are tons of ways to do this but I really want the answer to the subject. What i'm referring to is a form that someone can print from the browser and "fill in the blanks" on the page where there are "underscores". My question is how to code those underscores. I tried manipulating the <hr> tag but it's putting way too much space in between each <hr>. I've already coded a "fill in the blank" line using <u> nbsp;</u> but that looks very messy. What do you guys/gals think? http://www.colletts.co.uk/winter_dolomites.htm I have the above page that redirects users to my Winter Website - the HTML below isn't valid W3C does anyone know of a better and valid way to get this done? Cheers, Mas HTML Code: <META HTTP-EQUIV="Refresh" CONTENT="2.5;URL=http://www.colletts.co.uk/winter/winter_dolomites.html" /> Hello, I want to load a page in a iframe, and when i do this, i want that page to be displayed not at the begining of that page, i want that page to be displayed at a "x" and "y" position specificated by me. How can i do that? Thank you. hi, i am working on <div> i have to hide some part of the table. I am not able to hide that table part can anybady tell me where is the error. Code: <html> <head> <script type="text/javascript"> function callme(){ document.getElementById("hid").style.visibility="visible"; } function hideme(){ document.getElementById("hid").style.visibility="hidden"; } </script> </head> <body> <form name="myform"> <table width="100%" border="4" cellpadding="2" cellspacing="2"> <tr> <td class="tableheader" colspan="9">TS </td> </tr> <div style="visibility:hidden" id="hid"> <tr> <td width="17%" class="labeltext">Tran Code</td> <td width="1%" class="blanktext">:</td> <td colspan="4" class="blanktext">Name</td> </tr> <tr> <td width="17%" class="labeltext">Product Type</td> <td width="1%" class="blanktext">:</td> <td colspan="4" class="blanktext"> </td> </tr> </div> <tr> <td> </td> </tr> </table> <input type="button" onclick="callme()" value="show"> <input type="button" onclick="hideme()" value="hide"> </form> </body> </html> thx in Adv, Hanm. Hi, I have got an input form to upload files; the form also accepts some other user input. The upload works fine, but I need to display some filenames by default, but this does not work. I tried using: <input type="file" name="images[]" value="<?php echo $default_filename; ?>"... This did not work, so I tried: <input type="file" name="images[]" value="Testfile.jpg"..., but this does not work too. All this is in a <form action="<?php echo $_PHP_SELF; ?>" method="post" enctype="multipart/form-data">. It seems to me that in an input field of type "file", default values are not accepted, though they should be according to the documentation. Any help will be greatly appreciated as I need this feature. Thanks On my page, I have a form: HTML Code: <div id="upfile"> <input type="file" name="uploadform" size="30" id="fileupload2"> </div> Now, I'm wondering, is there any way that I can set a default value for this? Ex "C:\My Documents\file.txt". I tried value=, but I guess it doesn't work for the "file" type. I'd change it, but I need it to be "file".. Any help? Edit: Just realized that spelling mistake in the title.. Rather than write them out i took a screenshot. So how do i get past those? Hey, I'm trying to write some code for expanding and concealing text You can see this in action at youtube when you click the (more) button to expand text. Suppose I had a heading: MyHeading and a body of text: MyTextHere How do I make it so that when you click MyHeading it makes MyTextHere (initially not visible) appear, and when you click MyHeading again, it makes MyTextHere disappear? Thanks Alot. Hi, I have a problem with validating Strict XHTML 1.0 ... The tag: "option" doesn't have an attribute: "onchange" in currently active versions.[XHTML 1.0 Strict]... Is there a way around this? Here's the code:. <select name="birth_month" onchange="form_d('yes');" size="1" style="width:8em"> <option<?php echo empty($a_birth_month)?' selected="selected"':''?> value="" onchange="form_d('yes');" >Month</option> Thanks Only another million pages to go. |