скрыть содержимое, когда мышь

0

HTML

<ul class="nav-tabs">
  <li class="tab1"><a href="/" class="tab-link">Home</a></li>
  <li class="tab2 active"><a href="/" class="tab-link">...</a></li>
  <li class="tab3"><a href="/" class="tab-link">...</li>
  <li class="tab4"><a href="/" class="tab-link">...</li>
</ul>

<div id="tab-content">
  <div class="tab2"></div>
  <div class="tab3"> </div>
</div>

когда мышь находится на навигационных вкладках li. показано соответствующее содержимое div в табу-содержании. когда опускаются nav-tabs li. отображается соответствующее содержимое div.

JQuery:

$( ".nav-tabs li" ).hover(
  function() {
     $( "#tab-content div" ).css( "display", "block" );
  }, function() {
     $( "#tab-content div" ).css( "display", "none" );
  }
);

с кодом что-то не так. когда отображается соответствующий div в части tab-content. Я не могу переместить мышь на дочернем ссылку. 2, когда я нахожусь на других nav-tabs li. другое содержание li также показывает. как исправить? Спасибо.

  • 0
    Пожалуйста, очистите ваш код
Теги:

1 ответ

0

Пытаться

$(".nav-tabs li").hover(function () {
    $("#tab-content div." + this.className.match(/(tab\d+)/)[0]).show();
}, function () {
    $("#tab-content div." + this.className.match(/(tab\d+)/)[0]).hide();
});

Демо: скрипка

  • 0
    Спасибо. все в порядке. но когда мышь пропускает ".nav-tabs li". # tab-content div ... not hide.
  • 0
    в демо-примере. во-первых, содержимое tab2 tab3 скрыто. когда я пропускаю жизнь Содержание tab2 скрыто. Спасибо.
Показать ещё 1 комментарий

Ещё вопросы

Сообщество Overcoder
Наверх
Меню