【问题标题】:Is there a way to add an MP3 player to my website so that iPhone & iPad users can use it有没有办法将 MP3 播放器添加到我的网站,以便 iPhone 和 iPad 用户可以使用它
【发布时间】:2010-06-10 17:24:16
【问题描述】:

我有一个网站 www.askvioletnow.com。我添加了一个 Flash mp3 播放器,当您转到该页面时,它会播放一段声音。

我知道 Flash 不能在 iPhone 操作系统上运行,但有没有办法让这种类型的 mp3 播放器在 iPhone 上运行?我在想也许是一个 javascript mp3 播放器。

我最终想要的是用不同的 mp3 播放器替换我的 flash mp3 播放器并拥有它,这样播放器就可以在 Windows 和 Mac 计算机以及 iPhone 设备上使用。

提前致谢。

【问题讨论】:

  • “我添加了一个 Flash mp3 播放器,当你转到页面时它会播放声音片段。”请不要。
  • 我同意ceejayoz。谈论绝对可怕的用户体验。

标签: flash mp3 iphone


【解决方案1】:

您需要在 HTML5 中使用 <audio> 标记...您还需要更改您的文档类型以匹配。因此,您可以使用 javascript 来识别 Apple 类型的设备,并在必要时切换到音频标签。

将您的嵌入包裹在 <div> 中并给它一个 ID 说 mp3 像这样

<div id="mp3">
<script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0','width','550','height','400','title','Mp3 Player','src','file:///Macintosh HD/Users/phwd/Desktop/mp3player','quality','high','pluginspage','http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash','movie','file:///Macintosh HD/Users/phwd/Desktop/mp3player' ); //end AC code
</script><noscript><object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0" width="550" height="400" title="Mp3 Player">
    <param name="movie" value="file:///Macintosh HD/Users/phwd/Desktop/mp3player.swf" />
    <param name="quality" value="high" />
    <embed src="file:///Macintosh HD/Users/phwd/Desktop/mp3player.swf" quality="high" pluginspage="http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash" type="application/x-shockwave-flash" width="550" height="400"></embed>
  </object></noscript>
</div>

然后在 div 之后添加一些 javascript 来处理 Iphone 和 ipods

<p><script type="text/javascript" language="javascript">
<!--
if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i)))
{
     document.getElementById("mp3").innerHTML = "<audio autoplay=\"autoplay\" controls=\"controls\"><source src=\"mp3player.mp3\" /></audio>";
}
-->
</script></p>

已编辑:不确定 iPad 检测是否有效,但为了完整起见,我添加了它。

(navigator.userAgent.match(/iPad/i))

【讨论】:

    【解决方案2】:

    当然,您将无法使用闪光灯。一种选择是使用 HTML5。下面是一款现成的基于 html5 的音频播放器:http://www.happyworm.com/jquery/jplayer/

    你也可以看看html5音频标签。

    【讨论】:

    • 虽然现在我访问了您的网站,但我认为您的做法完全错误。我真的很讨厌在我打开页面时开始播放音频的网站。而且我不是唯一一个。请摆脱这个“功能”或至少允许用户先点击播放按钮。
    • 我同意你的观点,当你进入一个网站时播放声音文件时它经常很烦人,但是我对这个网站进行了两种方式的拆分测试,通过播放声音文件我将选择率提高到 33%从 27%。
    • “我将选择加入率从 27% 提高到 33%”——这是一个很小的差异。你的样本量是多少?
    【解决方案3】:

    这是一个适合我的简单解决方案。它是一个 JavaScript,用于向 IOS 用户显示内置的 HTML5 MP3 播放器,无法将其配置为好看。

    它向所有非 IOS 用户显示一个 Flash MP3 播放器。我使用了已停产的 Google Player。您可以使用任何您想要的 MP3 播放器。

    <div align="center">
    
    <script type="text/javascript">
    <!-- Begin
    if((navigator.userAgent.match(/iPhone/i)) || (navigator.userAgent.match(/iPod/i)) || (navigator.userAgent.match(/iPad/i)))
    {
    document.write("<div align=\"center\">");
    document.write("<audio controls>");
    document.write("<source src=\"http://www.YourDomain.com/MP3/YourFileName.mp3\" type=\"audio/mpeg\">");
    document.write("</audio>");
    } else {
    document.write("<embed type=\"application/x-shockwave-flash\" flashvars=\"audioUrl=http://www.YourDomain.com/MP3/YourFileName.mp3\" src=\"http://www.YourDomain.com/PlayerFolder/3523697345-audio-player.swf\" width=\"300\" height=\"27\" quality=\"best\"></embed>");
    } 
    
    //-->
    </script>
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2023-01-17
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2022-10-23
      • 1970-01-01
      • 2021-12-08
      • 1970-01-01
      相关资源
      最近更新 更多