Xvento
@Xvento
WordPress Разработчик, Themeforest автор

Навигация для jquery Ui Tabs вне контейнера, как сделать?

Всем привет!

Использую Jquery Ui Tabs, и возникла трудность с реализацией двойной навигации для табов.

Ниже предоставлен HTML код необходимой структуры
<!-- Дополнительная навигация-->
<ul class="new-control">
	<li><a href="#tab-1">Tab one</a></li>
	<li><a href="#tab-2">Tab two</a></li>
	<li><a href="#tab-3">Tab hree</a></li>
</ul>

<div id="tab">
<!-- Основная навигация для табов-->
	<ul>
		<li><a href="#tab-1">Tab one</a></li>
		<li><a href="#tab-2">Tab two</a></li>
		<li><a href="#tab-3">Tab three</a></li>
	</ul>
	<div id="tab-1">
		<p>Centent 1</p>
	</div>
	<div id="tab-2">
		<p>Centent 4</p>
	</div>

	<div id="tab-3">
		<p>Centent 3</p>
	</div>
</div>


Необходимо сделать две навигации для табов, что бы с контейнера с клласом: new-control можно было открывать табы.
Песочница: https://jsfiddle.net/Brainiak/xLv2qkLu/8/

Подскажите как это можно реализовать ? Спасибо
Так же буду очень признателен если посоветуете плагин табов в котором можно такое реализовать
  • Вопрос задан
  • 348 просмотров
Решения вопроса 1
Exploding
@Exploding
wtf?
Ну вот так пойдет?
<ul class="new-control">
	<li><a href="#" data-tab="0">Tab one</a></li>
	<li><a href="#" data-tab="1">Tab two</a></li>
	<li><a href="#" data-tab="2">Tab hree</a></li>
</ul>


$("#tab").tabs();
$(".new-control a").on("click", function(){
    $("#tab").tabs("option", "active", $(this).data("tab"));
});


https://jsfiddle.net/g311gd2j/
Может и по-инвалидному, но пока че-то в голову ничего лучше не пришло)))
Ответ написан
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы