Embedded Video is displayed on webpage.
I have a youtube video embedded within the 'Modal Display' div.
I have linking to this page through PHP referencing - ?page=videos etc...
When the page loads, the video is already 'shown' on the page, where it should be when the user clicks the link to reveal the Modal.
The video should not be shown until the visitor has clicked on the appropriate link. An example of the embed code used is:
<div id="addYoutube" class="reveal-modal">
<h1>Add a YouTube Business Video.</h1>
<object width="425" height="349"><param name="movie" value="http://www.youtube.com/v/zoMYU_nOGNg"></param>
<param name="allowFullScreen" value="false" autoplay="1" modestbranding="1"></param>
<param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/zoMYU_nOGNg?
version=3&hl=en_US" type="application/x-shockwave-flash" width="425" height="349" allowscriptaccess="always"
allowfullscreen="false"></embed></object>
<a class="close-reveal-modal">Exit</a>
</div>
Would this issue be solved by editing a parameter within the embedded code?
Many thanks.
Are you including the reveal.css on this page? Without this the modal will not be hidden by default.
If you are, then can you please provide a link to a live example of the code, so I can see why the content is not being hidden inside the display: none; div.
Thanks!
I have a similar issue in IE7. I have a table inside of the modal that has 1px borders on the tops of the table rows. It seems that everything is hidden except these 1px lines from the table on page load.
It's odd because, if you click any button that opens the same or different modal the lines disappear.
Another issue also, any videos in the background that aren't inside the div, also show through the faded background.
I'm having this problem too - the video is already 'shown' on the page, until either a scroll or mouse click.
http://www.deeside.ac.uk/build/
Please, any suggestions?!
Try setting the wmode to opaque http://stackoverflow.com/questions/4050999/youtube-iframe-wmode-issue
Works like a charm - thank you so much!
Had the same trouble with embedding a Vimeo video, tried solution by mkelly12 with no luck My solution: add to styles css: iframe {display:none} added an id to vimeos iframe code [#contentIframe]
added class to modal href [a href="#" data-reveal-id="mymodal" class="vidshow"]
- created 2 simple jquery scripts to display/hide iframe $(".vidshow").click(function(){ $("#contentIframe").css({'display':'block'});
$(".vidhide").click(function(){ $("#contentIframe").css({'display':'none'});
on close of modal window [a href="#" class="close-reveal-modal vidhide"]