Need Streaming Audio Player (small height 45px) As website widget (NO FLASH)

I've fiddled with three different HTML5 <audio> tags on my webpage design and can't get any of the code to display a player and if it does, the play button doesn't work.  I need an iPhone / Safari friendly method for playing streaming music files from my website and have yet to find a solution that is not flash based.

The MP3 player from Reverbnation is too tall and doesn't load on a mobile browser even though it is HTML5 and not flash.

I need some proven solutions that meet my needs (45px height max) and able to play .mp3 and .ogg files.
LVL 1
day6Asked:
Who is Participating?
 
leakim971PluritechnicianCommented:
It took me less than a minute to customize it and give it 32px height size...
hope you will find something which fully answering your needs...
merry christmas
Clipboard01.jpg
0
 
leakim971PluritechnicianCommented:
0
 
MereteCommented:
He said NO FLASH!! lol
I can't prove these but hopefully meets some of your questions.
 If not wait till Monday.
Cheers Merete

A Simple Way To Play MP3 Audio Files
Extract
The iPhone media player is very easy to use, but it only works in landscape mode and it seems designed more for video than audio.  
If you wish to play an onboard MP3 or an MP3 file as it’s downloading (not really streaming, but progressive download) you have another option!  
Use the audio player embedded with Safari running in a UIWebView.
 
Here’s how to do it without having to create a special window for it.  Instantiate an UIWebView object using a 1×1 pixel sized frame (here self.playerView is an instance variable on my controller and is NOT added as a subview)
Source
And this one
WWW FAQs: How do I play MP3s in my web page on the iPhone?

How to
HTML5 Audio player works on safari/Chrome, but not iPhone
http://stackoverflow.com/questions/10688930/html5-audio-player-works-on-safari-chrome-but-not-iphone
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

 
leakim971PluritechnicianCommented:
JW Player use Flash OR HTML5
0
 
mcnuteCommented:
HTML 5 is capable of it.
<audio controls="controls">
  <source src="horse.ogg" type="audio/ogg" />
  <source src="horse.mp3" type="audio/mpeg" />
  Your browser does not support the audio element.
</audio> 

Open in new window

0
 
day6Author Commented:
the jw player seems to be video focused, and that's not my goal. also, the HTML5 player code posted by MCNUTE is the same code I've used and it doesn't work on mobile browsers.
0
 
leakim971PluritechnicianCommented:
check this one, you can create your own interface : http://www.jplayer.org/
0
 
day6Author Commented:
None of these replies solved my issue... at all.
0
 
day6Author Commented:
I've requested that this question be closed as follows:

Accepted answer: 0 points for day6's comment #a38706803

for the following reason:

None of the answers offered provided a solution.
0
 
leakim971PluritechnicianCommented:
where I was wrong with jplayer?
0
 
day6Author Commented:
@leakim971 The Jplayer did NOT provide the ability I requested. It is offered in HTML5 but not scalable to the size I requested and does not play on iPhone platform.  I would NOT have said NO SUGGESTED SOLUTIONS work if I didn't mean it.
0
 
leakim971PluritechnicianCommented:
does not play on iPhone platform

Platforms and Browsers

Windows: Firefox, Chrome, Opera, Safari, IE6, IE7, IE8, IE9
OSX: Safari, Firefox, Chrome, Opera
iOS: Mobile Safari: iPad, iPhone, iPod Touch
Android: Android 2.3 Browser
Blackberry: OS 7 Phone Browser, PlayBook Browser

but not scalable to the size I requested
Choose jPlayer

easy to get started, deploy in minutes
totally customizable and skinnable using HTML and CSS
lightweight - only 8KB minified and Gzipped

I used this plugin to build a player with a vinyl turning. you stop/start by clicking on the vinyl itself
0
 
day6Author Commented:
@leakim971

I can READ what they wrote too. Don't you think I took the time to check it out FIRST before ruling out them as an option. Totally customizable does NOT include the size I requested.  Give it up dude. That was the first option I went to before even posting this thread, so unless you can show me a deployed and operating version of what I need, give up on pushing a solution that WILL NOT MEET MY NEED. Sheesh!
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.