Solved

Embedded Audio player in web pages

Posted on 2012-04-09
2
704 Views
Last Modified: 2013-11-19
I am hoping someone here may know what would be a good audio player to embed in webpages.  I've tried several players, but haven't had any luck getting something to work in Windows 7 Firefox 11 browser.  The buttons don't work for me, but can start and stop the files using the space bar.  I am also finding the page playing all the songs simultaneously in PC Chrome. Haven't had trouble on a Mac.

Is there any all around good player for mp3s for the web?

Here is my page:http://americanart.si.edu/luce/mixtape/

This is the first player used:
<object classid="clsid:02BF25D5-8C17-4B23-BC80-D3488ABDDC6B"
codebase="http://www.apple.com/qtactivex/qtplugin.cab" width="200" height="20">

<param name="src" value="/luce/mixtape/audio/TrainingWheels.mp3" /> <param name="controller" value="true" /> <param name="autoplay" value="false" /> <param name="autostart" value="0" /> <param name="pluginspage" value="http://www.apple.com/quicktime/download/" />

<!--[if !IE]> <-->

<object type="audio/x-mpeg" data="/luce/mixtape/audio/TrainingWheels.mp3" width="200" height="20"> <param name="src" value="/luce/mixtape/audio/TrainingWheels.mp3" /> <param name="controller" value="true" /> <param name="autoplay" value="false" /> <param name="autostart" value="0" /> <param name="pluginurl" value="http://www.apple.com/quicktime/download/" /> <embed src="/luce/mixtape/audio/TrainingWheels.mp3" type="audio/x-mpeg" width="200" height="20" autostart="false" controller="true" ></embed> </object>

<!--> <![endif]-->
</object>

This is the second quicktime player (used in the remain 4 songs):
<embed width="200" height="20" pluginspage="/quicktime/download/" autoplay="false" src="/luce/mixtape/audio/MistyEyes.mp3"></embed><br /> <p class="noindent">

Thank you!
0
Comment
Question by:cbeverly
2 Comments
 
LVL 109

Accepted Solution

by:
Ray Paseur earned 500 total points
ID: 37826968
Using Windows 7 and FF 11.0 the page works perfectly for me.  All the bars appear in the right places and the music plays when I click the appropriate button.  Of course, I can start two audio streams at the same time and this sounds goofy, but you can't fix goofy client behavior.  In Chrome all of the embedded audio files started playing at the same time.  Inmy experience, it's always been better to put one audio file on the page at a time, and just provide links if you want to present multiple audio files to the client.

See http://validator.w3.org/check?uri=http%3A%2F%2Famericanart.si.edu%2Fluce%2Fmixtape%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

You might want to consider a couple of things.  Are all of the <object> tags closed?  Consider adding "type=" attributes to the object.  Maybe type="audio/mpeg" or type="video/wmv"?  Not sure, but those should be worth testing.

Best regards, ~Ray
0
 

Author Closing Comment

by:cbeverly
ID: 37828458
Thank you. Adding the object tags worked.
0

Featured Post

3 Use Cases for Connected Systems

Our Dev teams are like yours. They’re continually cranking out code for new features/bugs fixes, testing, deploying, testing some more, responding to production monitoring events and more. It’s complex. So, we thought you’d like to see what’s working for us.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

This article discusses four methods for overlaying images in a container on a web page
Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
The viewer will learn how to create and use a small PHP class to apply a watermark to an image. This video shows the viewer the setup for the PHP watermark as well as important coding language. Continue to Part 2 to learn the core code used in creat…
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question