Home/ Questions/Q 282949
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-12T05:19:56+00:00

I have a flash object that I am trying to show and hide along

  • 0

I have a flash object that I am trying to show and hide along with the rest of my hidden div. Without the flash object, the hidden div works great. When the page loads, this style keeps the div hidden:

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

But when I add the flash object it always appears.

<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>

The flash object is the WordPress Audio Player and it comes with its own Javascript file which seems to cause the player object to replace an element with an id such as ‘audioplayer_1’ as in the installation example below (from the player’s docs).

Besides the style, do I need some some JQuery code on document load to try to override the “always show” character of the player object? If so, what event would I need to target?

   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>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    I’ve solved a problem like this using swfobject. The solution is to not call the embed() method until the div is shown. So if you’re using jQuery for example your HTML might look like:

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

    and for jQuery would be something like:

    $('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
));
    • 0