Показать сообщение отдельно
  #1 (permalink)  
Старый 04.12.2020, 17:41
Интересующийся
Отправить личное сообщение для max1985 Посмотреть профиль Найти все сообщения от max1985
 
Регистрация: 03.07.2018
Сообщений: 25

Переходы по табам с помощью ссылок в описании вкладки
Здравствуйте!
Помогите допилить вкладки сделанные на бутстрап 3
Сейчас код выглядит так:
<div class="row techno-description" role="tabpanel" id="myTab">
<div id="cf7" class="shadow">
  <img class="opaque" src="/img/bg/111.png" />
  <img src="/img/bg/222.png" />
  <img src="/img/bg/333.png" />
</div>
<ul class="nav nav-tabs techno-menu cf7_controls" id="guide-tabs">
  <li class="active" id="selected">
    <a class="first" data-toggle="tab" href="#1">111</a>
  </li>
  <li>
    <a class="first" data-toggle="tab" href="#2">222</a>
  </li>
  <li>
    <a class="first" data-toggle="tab" href="#3">333</a>
  </li>
</ul>	
</div>

<div class="tab-content">
  <div class="tab-pane active" id="1">
    <div class="row">
  <div class="col-md-3 img-box">
	  111
  </div>
  <div class="col-md-9 text-box">
  <p>Описание 111</p>
  <div class="descr"><a data-toggle="tab" href="#2"><img src="/img/compl/pr3.png" /></a></div>
  </div>
</div>
  </div>
  <div class="tab-pane" id="2">
    <div class="row">
  <div class="col-md-3 img-box">
      222
  </div>
  <div class="col-md-9 text-box">
  <div class="row">
  <p>Описание 222</p>
  <div class="descr"><a data-toggle="tab" href="#3"><img src="/img/compl/pr3.png" /></a></div>
  </div>
  </div>
</div>
  </div>
  <div class="tab-pane" id="3">
    <div class="row">
  <div class="col-md-3 img-box">
	  333
  </div>
  <div class="col-md-9 text-box">
  <p>Описание 333</p>
  <div class="descr"><a data-toggle="tab" href="#4"><img src="/img/compl/pr3.png" /></a></div>
  </div>
</div>
  </div>

<script>
$(document).ready(function() {
  $(".cf7_controls").on('click', 'li', function() {
    $("#cf7 img").removeClass("opaque");

    var newImage = $(this).index();

    $("#cf7 img").eq(newImage).addClass("opaque");

    $(".cf7_controls li").removeId("selected");
    $(this).addId("selected");
  });
});
</script>

</div>
Сейчас при переходе по такой ссылке внутри вкладки
<div class="descr"><a data-toggle="tab" href="#4"><img src="/img/compl/pr3.png" /></a></div>

содержимое вкладки открывается, а сам таб не меняется.
Подскажите чего не хватает?
Спасибо!
Ответить с цитированием