вопрос
Всем привет Профессионалы. Внизу скрипт табов.
Вот к примеру у майл.ру при нажатии 1 раз на таб сначала показывается таб на который было нажатие,
а при повторном нажатии на него же уже переходит по ссылке.
А у меня при нажатии на вкладку открывается вкладка и тут же сама ссылка.
Как сделать что бы при нажатии 1 раз на вкладку открывалась сама вкладка, а при повторном нажатии на нее же уже ссылка?
Спасибо огромное заранее за помощь.
Вот к примеру у майл.ру при нажатии 1 раз на таб сначала показывается таб на который было нажатие,
а при повторном нажатии на него же уже переходит по ссылке.
А у меня при нажатии на вкладку открывается вкладка и тут же сама ссылка.
Как сделать что бы при нажатии 1 раз на вкладку открывалась сама вкладка, а при повторном нажатии на нее же уже ссылка?
Спасибо огромное заранее за помощь.
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 li:first').addClass(options.activeClass);
$(this).find('.index-tabs li').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('li').removeClass(options.activeClass);
$(this).addClass(options.activeClass);
}
);
});
};
<div class="index-tabs">
<ul>
<li ><a href="/lol" target="_blank">Первая</a></li>
<li><a href="/lol2" target="_blank">Вторая</a></li>
</ul>
<div class="index-panel">
<div class="tt-panel" >
Инфо Первого
</div>
<div class="tt-panel" >
Инфо Второго
</div>
</div>
</div>
После
вставить
Полный пример
$(this).addClass(options.activeClass);
вставить
if(!$(this).attr('data-click')){
$(this).attr('data-click', 'yes');
return false;
}
Полный пример
<style>
.index-tabs span {
float:left;
color:#808080;
border:1px solid #dacec5;
border-bottom:0;
background:#f9f9f9;
padding:10px 15px 10px 15px;
margin:0 2px 0 0;
cursor:pointer;
}
.tt-panel {
display:none;
width:450px;
color:#3a1821;
border:1px solid #dacec5;
border-top:0;
background:#e6e2d2;
padding:10px;
clear:both;
}
.active-ttab {
color:#000 !important;
background:#e1e1e1 !important;
}
.active-ttab2 {
color:#83390d !important;
background:#e6e2d2 !important;
}
</style>
<script type="text/javascript" src="http://dle-field.ura/engine/classes/js/jquery.js"></script>
<script>
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);
if(!$(this).attr('data-click')){
$(this).attr('data-click', 'yes');
return false;
}
}
);
});
};
</script>
<script type="text/javascript">
$(document).ready(function() {
$('.tt-tabs').ttabs();
});
</script>
<div class="tt-tabs">
<div class="index-tabs">
<span><a href="/" target="_blank">Первая вкладка</a></span>
<span><a href="/" target="_blank">Вторая вкладка</a></span></span>
<span><a href="/" target="_blank">Третья вкладка</a></span>
</div>
<div class="index-panel">
<div class="tt-panel">
Содержание первой вкладки
</div>
<div class="tt-panel">
Содержание второй вкладки
</div>
<div class="tt-panel">
Содержание третьей вкладки
</div>
</div>
</div>