Показать сообщение отдельно
  #1 (permalink)  
Старый 15.03.2013, 23:30
Новичок на форуме
Отправить личное сообщение для Houston Посмотреть профиль Найти все сообщения от Houston
 
Регистрация: 15.03.2013
Сообщений: 2

Переключатель табов(вкладок) - не работает в InternetExplorer
Здравствуйте, мне на сайте нужны переключатели табов (вкладок).
А если точнее, несколько окон с табами разными. К примеру
Переключать вкладки, новостей между популярные и последние.
Также само и для Статей, последние и популярные и тд.

Если у вас есть, знаете легкое, не громоздкое решение, и если оно лучше чем то что у меня в данный момент, то не нужно помогать, лучше киньте ссылку на скрипт.

Вот на этом сайте нашел скрипт переключателя вкладок
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>
Ответить с цитированием