jQuery.fn.ttabs = function(options){
   
    var options = jQuery.extend({

        activeClass: 'active-ttab' // Класс активной вкладки
       
      },options);
   
    return this.each(function() {
           
        $(this).find('.tt-panel:first').show(0);
        $(this).find('.index-tabs span:first').addClass(options.activeClass);
       
        $(this).find('.index-tabs span').click(
            function() {
                $(this).parent().parent().find('.index-panel .tt-panel').hide(0);
                var numEl= $(this).index();
                $(this).parent().parent().find('.index-panel .tt-panel').eq(numEl).show();   
                $(this).parent().find('span').removeClass(options.activeClass);
                $(this).addClass(options.activeClass);
            }
        );
       
    });
   
};

/*
* активируем плагин и применяем его
*/
$(document).ready(function(){
$('.tt-tabs').ttabs();
});

<div class="tt-tabs">
    <div class="index-tabs">
    <span class="active-ttab">Кино</span>
        <span class="">Трейлер</span>
       
    </div>
    <div class="index-panel">

    <div class="tt-panel" style="display: block;">
        <noindex>
        <div id="kodik-player"></div>
           </noindex>
    </div>

    <div class="tt-panel" style="display: none;">
        <noindex>
<center>[xfgiven_treiler]<br/><iframe src="[xfvalue_treiler]" width="480" height="300" frameborder="0"  rel="nofollow" ></iframe>[/xfgiven_treiler]</center>
         </noindex>
    </div>
    </div>
</div>

.index-tabs {
background: #000000;
border: 2px solid #CCCCCC;
border-bottom: none;
border-radius: 10px 10px 0 0;
overflow: hidden;
}
.index-tabs span {
cursor: pointer;
margin: 0 5px 7px 0;
float: left;
padding: 5px;
background: -moz-linear-gradient(center top , #FFFFFF 0%, #ddd 100%);
color: #929191;
}
.active-ttab {
font: bold 14px Arial,Helvetica,sans-serif;
color: #fff !important;
background: -moz-linear-gradient(center top , #EB516B 0%, #410110 100%) !important;
}