淡入選定的div並將其設置在其他頂部

我需要創建一個菜單，並在div之間進行點擊，當我點擊div時，我希望它位於其他頂部。淡入選定的div並將其設置在其他頂部

與this非常相似，但點擊時，我希望它在其他div上淡入。

任何想法？

謝謝。

2012-07-31 Justin Meli

相關http://stackoverflow.com/questions/3079330/css3-fade-effect – 2012-07-31 08:05:08

用戶能否動畫以動畫的不透明度時，它是在最上面：http://jsfiddle.net/bingjie2680/f9j9a/120/

$("div").click(function(){ 
    $("div").css("zIndex",1); 
    $(this).css({"zIndex":100, 'opacity':0.4}).animate({'opacity':1}, 1000); 
});

來源

2012-07-31 08:04:43 bingjie2680

這幾乎是我一直在尋找的 - 我怎麼控制動畫的時間？ – 2012-07-31 08:08:23

將時間添加爲第二個參數。看到更新，你也可以將起始不透明度調整到0.4，看起來更光滑。 – bingjie2680 2012-07-31 08:08:59

這將工作，同時還支持在飛行中添加和刪除盒（相對於其他的答案），因爲事件代表團：

$("#container").on("click", "div", function(e) { 
    $("#container div").css("z-index", 0); 
    $(this).css({ "z-index": 10, "opacity": 0.4 }) 
     .fadeTo(400, 1); 
});

可以選擇添加.not($(this))到$("#container div")以避免改變Z-指數0表示當前選中的框。但是因爲我們在沒有必要的情況下將其改回10。如果代碼在未來變得更加複雜，可以避免bug。

嘗試一下這裏：
http://jsfiddle.net/BWABk/

來源

2012-07-31 08:02:56

事情是這樣的，也許。可能需要調整以適應。

DEMO

$("div").click(function(){ 
    $("div").css("zIndex",1); 
    $(this).fadeOut('slow', function() { 
     $(this).css("zIndex",100); 
     $(this).fadeIn('slow'); 
    }); 
});

來源

2012-07-31 08:07:20 TheCarver

淡入選定的div並將其設置在其他頂部

回答

相關問題