4

I have 3 tabs on my site. Inside 2nd (hidden) div contains a YouTube video in an iframe. When I click on second tab(containing video) video starts playing. On click of either 1st or 3rd tab (containing images) content area still show video.Whereas it should show images for respective tabs. Video is not hiding in Safari 5.1

How can I achieve this?

CODE:: 3 tabs content (html)

<div class="view-content clearthis">
    <div id="photos">
        <div class="nav">
           <a class="hide-divs" id="prev" href="#">Prev</a><a id="next" href="#">Next</a></div>
              <div id="gallery">
                <asp:PlaceHolder ID="phRoomPhotoGallary" runat="server"></asp:PlaceHolder>
                </div>
              </div>
              <div id="video">
                <div id="pnlVideo" runat="server">
                   <iframe id="objVideo" width="667" height="344" src="<%=RoomVideoURL %>" frameborder="0" title="<%=RoomName %>" allowfullscreen></iframe>
                </div>
              </div>
              <div id="floor">
                <asp:Image ID="imgFloorPlan" runat="server" Height="344" Width="667" />
              </div>
            </div>

3 tabs 

enter code here


 <ul class="clearthis">
     <li id="tabPhoto" runat="server"><a id="linkPhotoTab" class="photostab" href="#photos" title="<%=RoomName %>">PHOTOS</a></li>
     <li id="tabVideo" runat="server"><a id="linkVideoTab" href="#video" title="<%=RoomName %>">VIDEO</a></li>
     <li id="tabFloor" runat="server" style="margin-right: 0px;"><a id="linkFloorTab"                                  href="#floor" title="<%=RoomName %>">FLOOR PLAN</a></li>
 </ul>
Tepken Vannkorn
  • 9,648
  • 14
  • 61
  • 86
Sneha
  • 41
  • 1
  • 3

1 Answers1

19

I've seen some pretty ridiculous answers about attempting to fix this problem in Safari. Instead, try adding:

"wmode=opaque"

as the first GET variable in the url for the youtube video.

(eg: src="http://www.youtube.com/embed/pPBLF2Ffbaw?wmode=opaque&rel=0")

Worked for me in a similar situation.

DanGaidin
  • 191
  • 1
  • 3
  • very clean and nice solution, and you are right , there many ridiculous solutions as work around. thanx a lot – Spyros Aug 28 '13 at 11:12