Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 29.08.2016, 12:31
Новичок на форуме
Отправить личное сообщение для yurashklyaev Посмотреть профиль Найти все сообщения от yurashklyaev
 
Регистрация: 29.08.2016
Сообщений: 2

Переключение табов (ui tabs)
День добрый!
Появилась проблема, которую нужно срочно решить. На сайте реализовано стандартное переключение между табами на базе ui. Но есть одна проблема-переключение между табами осуществляется по ссылками в теге li. Нужно чтобы переключение еще осуществлялось по ссылкам вправо/влево. Жду Ваших предложений!
Ответить с цитированием
  #2 (permalink)  
Старый 29.08.2016, 12:58
Аватар для destus
Профессор
Отправить личное сообщение для destus Посмотреть профиль Найти все сообщения от destus
 
Регистрация: 18.05.2011
Сообщений: 1,207

yurashklyaev,
сколько платишь?
Ответить с цитированием
  #3 (permalink)  
Старый 29.08.2016, 13:19
Новичок на форуме
Отправить личное сообщение для yurashklyaev Посмотреть профиль Найти все сообщения от yurashklyaev
 
Регистрация: 29.08.2016
Сообщений: 2

совета прошу)
Ответить с цитированием
  #4 (permalink)  
Старый 29.08.2016, 14:52
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,103

ui tabs prev next
yurashklyaev,
<!doctype html>

<html lang="en">

<head>

  <meta charset="utf-8">

  <title>tabs demo</title>

  <link rel="stylesheet" href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>

  <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script>

</head>

<body>


<input class="prev" type="button" value="prev">
<input class="next" type="button" value="next">
<div id="tabs">

  <ul>

    <li><a href="#fragment-1"><span>One</span></a></li>

    <li><a href="#fragment-2"><span>Two</span></a></li>

    <li><a href="#fragment-3"><span>Three</span></a></li>

  </ul>

  <div id="fragment-1">

    <p>First tab is active by default:</p>

    <pre><code>$( "#tabs" ).tabs(); </code></pre>

  </div>

  <div id="fragment-2">

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

  </div>

  <div id="fragment-3">

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

    Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.

  </div>

</div>


<script>

$( "#tabs" ).tabs();
var num = 0, len = 3;
$( ".next, .prev" ).on("click",function() {
num += $(this).is(".next") ? 1 : -1;
num == len && (num = 0);
num == -1 && (num = len -1)
$( "#tabs" ).tabs( "option", "active", num );
});
</script>



</body>

</html>
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
вложенные tabs c heightStyle: "fill" = проблема с высотой вложенных табов? flykeeper jQuery 4 02.03.2015 09:54
Изменение вкладок ui tabs по нажатию кнопки назад в браузере martinss jQuery 0 15.01.2014 12:46
перемещение при переключение табов abuGabi Элементы интерфейса 2 12.10.2011 12:15
jQuery Tools Tabs — как сделать авто-переключение табов? Grawl jQuery 0 06.03.2011 17:13
jquery UI tabs - директ-линк с одного из табов ZmeY jQuery 0 29.12.2010 15:21