Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>There are a couple of options here as I see them:</p> <p><strong>Option 1</strong></p> <p>Use the wmode tag and you need to set this as the object is rendered. Adding it later will not work <br/><a href="https://stackoverflow.com/questions/3923996/chrome-specific-issue-with-z-index-and-flash">(ref1)</a> <a href="https://stackoverflow.com/questions/886864/differences-between-using-wmodetransparent-opaque-window-for-an-embedded">(ref2)</a></p> <p>Using opaque should allow you to target the object with CSS z-index styles. Be aware that you should set this value in the <code>&lt;embed&gt;</code> tag as well as as a <code>param</code> <br/> <a href="http://www.communitymx.com/content/source/E5141/wmodeopaque.htm" rel="nofollow noreferrer">(ref3)</a> <a href="https://stackoverflow.com/questions/2129122/how-to-enable-html-content-on-top-of-flash-content-without-using-the-transparent">(ref4)</a></p> <p><strong>Option 2</strong></p> <p>Hide the object until a user has clicked on your preview button. I spent ages tracking down the javascript that you used before I noticed that Sotiris had said the same thing. I believe this is your code here:</p> <pre><code>$('#play_video_box').click(function(){ if(app.isiPhone() == "iphone" || app.isiPhone() == "ipad"){ return true; } $(this).fadeOut('fast'); $('#page_video_preview_image').fadeOut('fast'); var player = document.getElementById('player'); player.sendEvent('PLAY'); return false; }); </code></pre> <p>I would amend one line to:</p> <pre><code>$('#page_video_preview_image').fadeOut('fast',function(){$('#video_wrapper').css('visibility','visible')}); </code></pre> <p>And use CSS to set visibility to hidden by default. Depending on your no javascript support requirements you may need to modify that.</p> <p>The third link provided here is a rather good article on wmodes and how they work - I recommend checking that out if you decide to go with option 1 and run into trouble.</p> <p>Hope that helps!</p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload