Скрытие элементов управления в HTML5 аудио - PullRequest
Новая
       0

Скрытие элементов управления в HTML5 аудио

1 голос
/ 22 июня 2011

Хорошо, это странно. Учтите следующее: 

    <audio id="background_audio" autoplay="autoplay">
      <source src="static/audio/clip.ogg" type="audio/ogg" />
      <source src="static/audio/clip.mp3" type="audio/mpeg" />
    </audio> 
    <a href="#" onclick="document.getElementById('background_audio').muted = true; return false">mute sound</a>

    <!--[if lt IE 9]>
    <bgsound id="background_snd" src="static/audio/clip.mp3" autostart="true" loop="1">
    <a href="#" onclick="document.all['background_snd'].src=''; return false">mute sound</a>
    <![endif]-->

Он делает все, что я хочу (автозапуск аудио в IE, FF, Chrome и Safari), но есть одна маленькая проблема: В Internet Explorer 8 и ниже есть две кнопки «отключения звука». ( Если вы посмотрите код, вам должно быть понятно, почему.)

Мой вопрос: Можно ли это предотвратить?

Ответы [ 2 ]

2 голосов
/ 22 июня 2011

Обновление : лучшее решение ниже.

Вы можете использовать тег <script> внизу страницы и добавить идентификатор "normal_browser_control" в свой первый элемент управления отключением звука.

Управление отключением звука: 

<a href="#" id="normal_browser_control" onclick="document.getElementById('background_audio').muted = true; return false">mute sound</a>

JS с кодом из MSDN: 

<script><!--
function getInternetExplorerVersion()
// Returns the version of Internet Explorer or a -1
// (indicating the use of another browser).
{
  var rv = -1; // Return value assumes failure.
  if (navigator.appName == 'Microsoft Internet Explorer')
  {
    var ua = navigator.userAgent;
    var re  = new RegExp("MSIE ([0-9]{1,}[\.0-9]{0,})");
    if (re.exec(ua) != null)
      rv = parseFloat( RegExp.$1 );
  }
  return rv;
}

var ie_ver = getInternetExplorerVersion();

if(ie_ver > 0 && ie_ver < 9) document.getElementById('normal_browser_control').style.display = 'none';
//--></script>

:)

1 голос
/ 22 июня 2011

Или еще проще ...

Вы можете использовать два разных тега: 

    <audio id="background_audio" autoplay="autoplay">
      <source src="static/audio/clip.ogg" type="audio/ogg" />
      <source src="static/audio/clip.mp3" type="audio/mpeg" />
    </audio> 

    <![if (!IE)|(gte IE 9)]>
    <a href="#" onclick="document.getElementById('background_audio').muted = true; return false">mute sound</a>
    <![endif]>

    <!--[if lt IE 9]>
    <bgsound id="background_snd" src="static/audio/clip.mp3" autostart="true" loop="1">
    <a href="#" onclick="document.all['background_snd'].src=''; return false">mute sound</a>
    <![endif]-->

Подробнее здесь: http://msdn.microsoft.com/en-us/library/ms537509(v=vs.85).aspx

...