Tabbed Content / Posts /

Thanks HTML5 Video within each View Div

First, Thanks very much. Great work!
I am trying to put an HTML5 Video tag in each View Div. View1 works perfectly, but View 2 & 3 do not (blank). Is there anything special about the Video tag or is there something additional that I need to do? My code is:

<ul class="tabs">
<li><a href="#" rel="view1">Features</a></li>
<li><a href="#" rel="view2">How to Use</a></li>
<li><a href="#" rel="view3">Source Code</a></li>
<div class="tabcontents">
<div id="view1" class="tabcontent">
<video class="vid" width="480" height="360" controls="controls" poster="" preload>
   <source src="media/Snorkling Tw-iPhone_20.mp4">
   <p>Video format not supported by this browser</p>
<div id="view2" class="tabcontent">
<video  width="480" height="360" controls="controls" poster="" preload>
   <source src="media/Snorkling Tw-30.mp4">
   <p>Video format not supported by this browser</p>
<div id="view3" class="tabcontent">
content 3
</div> <!--  =================================== end of .tabcontents -->

Thanks again
S.E. Samuels  11 years ago   viewed: 3708    

2 Answers

Maybe HTML5 video requires it must be in a visible block during the page load otherwise it will not be initiated properly (this is only my guess. I am not sure about it).

If that is true, you can consider using the advanced version, jQuery Tabs, that has onTabSelected event handler. You can consider generate the html5 video dynamically in the handler function.
milo   11 years ago
the same happens with an iframe...
Joe   11 years ago


Your name*
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: