事業部：擴大和調整回原來的懸停了

Question

我試圖擴大一個div上懸停一個特定的大小，我想股利回到原來的尺寸上懸停時，使用動畫功能。

有沒有什麼辦法可以計算div在動畫中的原始大小？

Answer 1

你必須保存原始狀態外/你的事件處理程序之前：

var origHeight = $("div").outerHeight(true); 

$("div").hover(function(e){ 
    $(this).stop().animate({ 
     height: e.type === "mouseenter" ? $(window).height() : origHeight 
    }); 
}); 

http://jsfiddle.net/b5HUU/2/

順便說一句，這不是一個好主意，這樣做懸停......因爲沒有空間讓鼠標離開（整個瀏覽器除外）。

更新

所以最好使用點擊事件：

var origHeight = $("div").outerHeight(true), 
    clickState = false; 

$("div").click(function(e){ 
    clickState = !clickState; 
    $(this).stop().animate({ 
     height: clickState ? $(window).height() : origHeight 
    }); 
}); 

http://jsfiddle.net/b5HUU/4/

Answer 2

需要stop動畫上mouseenter和mouseleave

var w = $('#an').width(), 
    n = w + 100 ; // particular size 

function widthAnimate(width){ 
    return function(){ 
     $('#an').stop().animate({ 
      width : width +'px', 
     }); 
    } 
}; 

$('#an').mouseenter(widthAnimate(n)) 
     .mouseleave(widthAnimate(w)); 

在jsfiddle中加入了此項