Здравствуйте, мне на сайте нужны переключатели табов (вкладок).
А если точнее, несколько окон с табами разными. К примеру
Переключать вкладки, новостей между популярные и последние.
Также само и для Статей, последние и популярные и тд.
Если у вас есть, знаете легкое, не громоздкое решение, и если оно лучше чем то что у меня в данный момент, то не нужно помогать, лучше киньте ссылку на скрипт.
Вот на этом сайте нашел скрипт переключателя вкладок
http://web4develop.ru/2010/08/menyu-...moshhi-jquery/
Если использовать только одно окно, то все работает во всех браузерах.
Для использования, когда на странице необходимо более одного блока вкладок(табов):
автор выложил пример:
http://web4develop.ru/wp-content/upl...2.1/index.html
и вот архив
http://web4develop.ru/wp-content/upl....1/tabs2.1.zip
-- но проблема в том, что в Internet Explorer не работает такое, и за счет этого перестают работать другие jQuery слайдеры и тд.
<script type="text/javascript">
jQuery(document).ready(function(){
function show_news() {
jQuery(".selectTabs").each(function () {
var tmp = jQuery(this);
console.log(jQuery(tmp).find(".topics_filters li"));
jQuery(tmp).find(".topics_filters li").each(function (i) {
jQuery(tmp).find(".topics_filters li:eq("+i+")").click(function(){
var tab_id=i+1;
jQuery(tmp).find(".topics_filters li").removeClass("selected");
jQuery(this).addClass("selected");
jQuery(tmp).find(".content .ta").stop(false,false).hide();
jQuery(tmp).find(".tab"+tab_id).stop(false,false).fadeIn("slow");
return false;
});
});
});
}
show_news();
});
</script>
и HTML
<div class="selectTabs">
<ul class="topics_filters">
<li class="selected">Последние</li>
<li>Популярные</li>
</ul>
<h2 class="topics_header">Новости</h2>
<div class="content">
<div class="ta tab1" style="display:block">Последние</div>
<div class="ta tab2">Популярные</div>
</div>
</div>
<div class="selectTabs">
<ul class="topics_filters">
<li class="selected">Последние</li>
<li>Популярные</li>
</ul>
<h2 class="topics_header">Статьи</h2>
<div class="content">
<div class="ta tab1" style="display:block">Последние</div>
<div class="ta tab2">Популярные</div>
</div>
</div>
