Как переопределить атрибут «всегда показывать» плагина в моем скрытом подражателе div? - PullRequest
2 голосов
/ 19 июля 2009

У меня есть флеш-объект, который я пытаюсь показать и скрыть вместе с остальной частью моего скрытого div Без флеш-объекта скрытый div отлично работает. Когда страница загружается, этот стиль скрывает div:

<style>
div {display:none;}
p {display:none;}
div p {display:none;}
</style>

Но когда я добавляю флеш-объект, он всегда появляется.

<div id="hidden1">
  <p id="audioplayer_1">Alternative content</p>
  <script type="text/javascript">
    AudioPlayer.embed("audioplayer_1", {soundFile: "http://yoursite.com/path/to/mp3_file.mp3"});  
  </script>
</div>

Флэш-объект - Wordpress Audio Player , и он поставляется с собственным файлом Javascript, который, кажется, заставляет объект проигрывателя заменять элемент с идентификатором, таким как 'audioplayer_1', как в примере установки ниже (из документации игрока).

Помимо стиля, нужен ли какой-нибудь код JQuery при загрузке документа, чтобы попытаться переопределить символ "всегда показывать" объекта проигрывателя? Если да, то на какое событие мне нужно нацелиться?

   1. <html>  
   2.     <head>  
   3.         <title>Your website</title>  
   4.   
   5.         ...  
   6.   
   7.         <script type="text/javascript" src="path/to/audio-player.js"></script>  
   8.         <script type="text/javascript">  
   9.             AudioPlayer.setup("http://yoursite.com/path/to/player.swf", {  
  10.                 width: 290  
  11.             });  
  12.         </script>  
  13.   
  14.     </head>  
  15.     <body>  
  16.   
  17.         <p id="audioplayer_1">Alternative content</p>  
  18.         <script type="text/javascript">  
  19.         AudioPlayer.embed("audioplayer_1", {soundFile: "http://yoursite.com/path/to/mp3_file.mp3"});  
  20.         </script>  
  21.   
  22.         <p id="audioplayer_2">Alternative content</p>  
  23.         <script type="text/javascript">  
  24.         AudioPlayer.embed("audioplayer_2", {soundFile: "http://yoursite.com/path/to/mp3_file_2.mp3"});  
  25.         </script>  
  26.   
  27.     </body>  
  28. </html>   

Ответы [ 2 ]

3 голосов
/ 20 июля 2009

Я решил такую ​​проблему, используя swfobject . Решение состоит в том, чтобы не вызывать метод embed (), пока не будет показан div. Так что если вы используете, например, jQuery, ваш HTML может выглядеть так:

<a href="#audioplayer_1">Play 1</a>
<div id="hidden1">
  <p id="audioplayer_1">Alternative content</p>
</div>

и для jQuery было бы что-то вроде:

$('a').click(function(
    target = $(this).attr('href');
    $('p'+target).parent().show(); // show the div
    AudioPlayer.embed("audioplayer_1", {soundFile: "mp3_file.mp3"}); // load the audio player
));
2 голосов
/ 19 июля 2009

Во-первых, вставленный вами демонстрационный код не содержит аудиопроигрывателей в скрытом разделе. Вы уверены, что они на самом деле скрытый элемент?

Если игроки все еще настаивают на том, чтобы их показывали, вы можете скрыть их в документе document.ready:

<html>
    <head>  
        <title>Your website</title>  

        ...  

        <script type="text/javascript" src="path/to/audio-player.js"></script>  
        <script type="text/javascript">  
            AudioPlayer.setup("http://yoursite.com/path/to/player.swf", {  
                width: 290  
            });

            $(document).ready(function() {
                $('.hidden object').hide();
                $('.hidden').hide();
            });
        </script>  

    </head> 
    <body> 

      <div class="hidden">
        <p id="audioplayer_1">Alternative content</p>  
        <script type="text/javascript">  
        AudioPlayer.embed("audioplayer_1", {soundFile: "http://yoursite.com/path/to/mp3_file.mp3"});  
        </script>  
      </div>

      <div class="hidden">
        <p id="audioplayer_2">Alternative content</p>  
        <script type="text/javascript">  
        AudioPlayer.embed("audioplayer_2", {soundFile: "http://yoursite.com/path/to/mp3_file_2.mp3"});  
        </script>  
      </div>
    </body>  
</html>

Не проверял код - дайте мне знать, если он не работает.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...