Блог

Привет, я остановился, пытаясь получить то, что мне нужно для работы.

На основе:

 $(".test a").hover(function(){
        $(this).toggle({ height: "200px" });
    }, function() {
        var currentTab = $(this).attr('href');
        $(this).stop(true, false).animate({ height: "100px" });
    });
});

<div class="test">
  <a href="#one">1</a>
  <a href="#two">2</a>
  <a href="#three">3</a>
</div>
  

Мне это нужно для анимации div не самого себя, я придумал приведенный ниже, который анимирует его вниз, но не создает резервную копию и т. Д:

 $(".test a").hover(function(){
        var activeTab = $(this).attr("href"); 

        $(activeTab).toggle({ height: "200px" });   }, function() {
        $(activeTab).stop(true, false).animate({ height: "100px" });    }); });

<div class="test">
<a href="#one">1</a>
<a href="#two">2</a>
<a href="#three">3</a>

<div id="one" class="tab one">1</div>
<div id="two" class="tab two">2</div>
<div id="three" class="tab three">3</div> </div>
  

Вам нужно повторно объявить переменную activeTab, потому что она существует только в области mouseenter, а не mouseout

 $(".test a").hover(function(){      
          var activeTab = $(this).attr("href"); 
          $(activeTab).toggle({ height: "200px" });   
     }, 
     function() {
          var activeTab = $(this).attr("href"); 
          $(activeTab).stop(true, false).animate({ height: "100px" });   
     }); 
});
  

 $(".test a").hover(function(){      var activeTab = $(this).attr("href"); 

        $(activeTab).toggle({ height: "200px" });   }, function() {
        $(activeTab).stop(true, false).animate({ height: "100px" });    }); });
  

Здесь есть несколько ошибок … одна из них — подсчитайте свои скобки….

 $(".test a").hover(function(){
    var activeTab = $(this).attr("href"); 
    $(activeTab).toggle({ height: "200px" });
},
function() {
    $(activeTab).stop(true, false).animate({ height: "100px" });
});
}); // too many closing brackets
  

Вторая проблема заключается в том, что var activeTab она выходит за рамки второй функции. Итак, вам нужно переопределить var activeTab во второй функции:

Это должно сработать:

 $(".test a").hover(function(){
    var activeTab = $(this).attr("href"); 
    $(activeTab).toggle({ height: "200px" });
},
function() {
    var activeTab = $(this).attr("href"); 
    $(activeTab).stop(true, false).animate({ height: "100px" });
});