I create tabs to play videos, and need to refresh page while some one click on other tab to play other video. I attached script to remain on same page and reload page but reload not pause the video but reload shortly not clearly.
Not whole page refresh on tab click??
HTML Part:
<div id="tabs-list">
<ul class="nav nav-tabs nav-justified" id="myTab">
<li class="active"><a href="#t1" data-toggle="tab">Live 1</a></li>
<li><a href="#t2" data-toggle="tab">Live 2</a></li>
<li><a href="#t3" data-toggle="tab">Live 3</a></li>
<li><a href="#t4" data-toggle="tab">Live 4</a></li>
</ul>
<div class="tab-content">
<div id="t1" class="tab-pane fade in active"><?php echo get_post_meta($post->ID, 'live1', true); ?></div>
<div id="t2" class="tab-pane fade"><?php echo get_post_meta($post->ID, 'live2', true); ?></div>
<div id="t3" class="tab-pane fade"><?php echo get_post_meta($post->ID, 'live3', true); ?></div>
<div id="t4" class="tab-pane fade"><?php echo get_post_meta($post->ID, 'live4', true); ?></div>
</div>
</div>
Script:
<script type="text/javascript">
$(document).ready(function () {
$('#tabs-list').click(function () {
location.reload();
});
});
$('#myTab a').click(function (e) {
e.preventDefault();
$(this).tab('show');
});
$("ul.nav-tabs > li > a").on("shown.bs.tab", function (e) {
var id = $(e.target).attr("href").substr(1);
window.location.hash = id;
});
var hash = window.location.hash;
$('#myTab a[href="' + hash + '"]').tab('show');
</script>
