HTML5-Video in Accessible Tabs

The video doesn't play automatically.

by abennington

HTML

<script src="http://grochtdreis.de/fuer-jsfiddle/js/jquery.tabs.min.js"></script>
<link rel="stylesheet" href="http://grochtdreis.de/fuer-jsfiddle/yaml/add-ons/accessible-tabs/tabs.css">
<div class="jquery_tabs">
    <h4>Video</h4>
    <div class="tabbody">
      
<video autobuffer controls autoplay>
  <source id="mp4" src="http://grochtdreis.de/fuer-jsfiddle/video/sintel_trailer-480.mp4" type="video/mp4">
</video>
        
    </div>
    <h4>Info</h4>
    <div class="tabbody">
        <p>Nein, meine Texte les ich nicht, so nicht, stöhnte Oxmox. Er war mit Franklin, Rockwell und dem halbtaxgrauen Panther Weidemann in Memphis (Heartbreak Hotel) zugange. Sie warteten auf die fette Gill, um bei der Bank of Helvetica die Kapitälchen in Kapital umzuwandeln. Oxmox ließ nicht locker. Ich fleh euch an, rettet meine Copy, gebt meinem Body nochn Durchschuß! Kein Problem, erbarmte sich Old Face Baskerville, streichelte seinen Hund, zog seine einspaltige Poppl, legte an und traf! (Zeidank nichts Ernstes – nurn bißchen Fraktur.) Oxmox: Danke, ist jetzt mit Abstand besser. Derweil jumpte der Fox leise over the Buhl, die sich mal wieder immerdar wie jedes Jahr gesellte. </p>
    </div>
</div>

CSS

html {padding: 20px 0; background-color: #efefef;}
body {width: 500px; padding: 20px 40px; margin: 0 auto; background: #fff; box-shadow: 1px 1px 5px rgba(0,0,0,0.5);}

video {
    width: 500px; 
    display: block;
}

JavaScript

$(document).ready(function() {
    $("html").addClass("js");

    $(".jquery_tabs").accessibleTabs({
        fxspeed: ''
    });
  
    // fix!!!
    // on initial loading of the page the video is played automatically
/*
    if($(".tabs-list li.first").hasClass("current")) {
        $("video").get(0).play();
    }
*/    
});