How to embed audio <OBJECT/>s conditional on browser capabilities

Discussion in 'HTML' started by ewan.dunbar@utoronto.ca, Mar 19, 2008.

  1. Guest

    Certain browsers don't have the right plugins or just mess up
    embedding an <OBJECT/> that contains an mp3, embedded like this:

    <div class="audiosection">
    <div class="audiosectionlabel">Press play to listen to this story.</
    div>
    <object autoplay="false" data="/objects/3.mp3" height="40"
    type="audio/mpeg" width="600">
    <param name = 'src' value = '/objects/3.mp3' />
    </object>
    </div>

    How can I test for the capability to load an mp3 embedded in a page
    like this, so that I can hide the whole DIV if it isn't going to work?
    Is it possible? All I can find on the web are tutorials about hiding
    things from certain browsers. Any information about how to test for
    ability to embed certain mimetypes using JS, or maybe different and
    more complicated HTML, welcome, or, failing that, reliable information
    on which browsers are just going to barf on this, and so I should hide
    the plugin from them.

    ewan
     
    , Mar 19, 2008
    #1
    1. Advertising

  2. Re: How to embed audio <OBJECT/>s conditional on browsercapabilities

    ewan.dunbar wrote:

    > <div class="audiosection">
    > <div class="audiosectionlabel">Press play to listen to this story.</
    > div>
    > <object autoplay="false" data="/objects/3.mp3" height="40"
    > type="audio/mpeg" width="600">
    > <param name = 'src' value = '/objects/3.mp3' />
    > </object>
    > </div>


    Browsers which don't understand <object> or are incapable of displaying
    this particular object, should fall back to displaying any HTML *inside*
    the <object> element.

    Taking your example, one way to provide a fall back would be:

    <div class="audiosection">
    <div class="audiosectionlabel">
    Press play to listen to this story.
    </div>
    <object data="/objects/3.mp3" height="40" type="audio/mpeg" width="600">
    <param name="src" value="/objects/3.mp3" />

    <a href="/objects/3.mp3">Play</a>

    </object>
    </div>

    If you're concerned about making your story accessible to as many people
    as possible, the next step would be to provide a text transcript for
    people with hearing problems (or simply no speakers on their computer).

    --
    Toby A Inkster BSc (Hons) ARCS
    [Geek of HTML/SQL/Perl/PHP/Python/Apache/Linux]
    [OS: Linux 2.6.17.14-mm-desktop-9mdvsmp, up 1 day, 17:56.]

    The Semantic Web
    http://tobyinkster.co.uk/blog/2008/03/09/sw/
     
    Toby A Inkster, Mar 19, 2008
    #2
    1. Advertising

  3. cwdjrxyz Guest

    On Mar 19, 8:54 am, wrote:
    > Certain browsers don't have the right plugins or just mess up
    > embedding an <OBJECT/> that contains an mp3, embedded like this:
    >
    > <div class="audiosection">
    > <div class="audiosectionlabel">Press play to listen to this story.</
    > div>
    > <object autoplay="false" data="/objects/3.mp3" height="40"
    > type="audio/mpeg" width="600">
    > <param name = 'src' value = '/objects/3.mp3' />
    > </object>
    > </div>
    >
    > How can I test for the capability to load an mp3 embedded in a page
    > like this, so that I can hide the whole DIV if it isn't going to work?
    > Is it possible? All I can find on the web are tutorials about hiding
    > things from certain browsers. Any information about how to test for
    > ability to embed certain mimetypes using JS, or maybe different and
    > more complicated HTML, welcome, or, failing that, reliable information
    > on which browsers are just going to barf on this, and so I should hide
    > the plugin from them.


    The problem is that the browser may have no or many working players,
    and different objects may apply for different players. For example I
    have WMP, Real, Winamp, flash, and several other players all working
    on IE7, Firefox, Seamonkey, Opera, and Safari for Windows browsers.To
    see how I am now handling this problem, see http://www.cwdjr.net/audio/single/songsingletest.php
    .. Don't bother to view the source code, but go to http://www.cwdjr.net/audio/single/
    to a directory that gives you a text file plus files for includes and
    all of the player objects used. Once you are set up, you only have to
    write a new short php page for your new page, since it uses all of the
    same object files and includes. And players do sometimes require
    corrections when they upgrade. If a player changes the object code
    needed, then one only has to change the one object file used as an
    include, and that fixes all of the pages that call for this object
    code. Usually when a player is not installed, then one sees nothing
    rather than a control. In rare cases one may just see a blank box
    where the player would be. As a last resort, a mp3 download is
    provided using a playlist file for it. Depending on how the computer
    is set up, you may be prompted to just download the mp3, or you are
    taken to the player that the computer owner has set up to be primary
    for mp3.

    Especially for spoken word, a highly compressed Windows wma or Real
    ra file will give good enough quality easily at bit rates low enough
    to be streamed on even a dialup connection. The mp3 format does not
    work as well as these at extremely high compression, although if you
    use a mp3PRO encoder, it works better than standard mp3 at low bit
    rates and will play on standard mp3 players. Since so many computers
    have flash installed, I also provide flash audio, with the flash audio
    actually being in the newer flv/swf format. Most people, other than
    perhaps a mother or lover, will only listen to one format, so you will
    not increase bandwidth usage much or any by including several audio
    format choices. Since disc space on a server is now dirt cheap, you
    need not worry about multiple formats of the same audio unless you are
    running a streaming video site with a huge number of long videos, and
    the site is very popular. I only use about 4 GB of server disc
    storage, and I could use 100 GB at least without paying extra.

    This concept can be expanded to include many audio files. See
    http://www.cwdjr.net/audio/multiple/songsAll3.php for an example. This
    is a bit more demanding than for a single song, because dozens of
    player objects must be generated and downloaded. The download thus
    would be slugish on dialup or low broadband.

    A concept much like the above can also be used to allow selection of
    videos in various formats and/or bit rates.
     
    cwdjrxyz, Mar 19, 2008
    #3
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Lance

    browser javascript capabilities

    Lance, Aug 14, 2004, in forum: ASP .Net
    Replies:
    1
    Views:
    2,277
    clintonG
    Aug 14, 2004
  2. Linus Nikander
    Replies:
    1
    Views:
    383
    Brusque
    Sep 20, 2004
  3. Nadav Popplewell
    Replies:
    4
    Views:
    401
    Nadav Popplewell
    Jan 21, 2008
  4. Isaac C.

    PPC Emulator, Pocket IE, Browser Capabilities

    Isaac C., Sep 5, 2004, in forum: ASP .Net Mobile
    Replies:
    2
    Views:
    202
    Yan-Hong Huang[MSFT]
    Sep 8, 2004
  5. Replies:
    3
    Views:
    240
    Jeremy
    Oct 12, 2006
Loading...

Share This Page