代码之家 › 专栏 › 技术社区 › Rakesh Juyal

为什么我不能用jquery设置div的z-index?

html jquery javascript

Rakesh Juyal · 技术社区 · 16 年前

我已经创建了一个示例
http://jsbin.com/eqiti3 这里有三个沙发。现在,我想做的是:单击任何一个DIV,它应该在其他DIV的顶部,然后淡入淡出,然后返回到原来的位置。这是我正在使用的:

$(".box").click( function () {
    var zindex = $(this).css('z-index');     
  /* this too is not working
    $(this).css('z-index',14);  
    $(this).fadeTo ( 'slow', 0.5 ).fadeTo('slow', 1 )
    $(this).css('z-index',zindex);
  */

    $(this).css('z-index',14).fadeTo  ( 'slow', 0.5 ).fadeTo('slow', 1 ).css('z-index',zindex);

} );

假如 $(this).css('z-index',14) 仅此一项就可以使DIV超过其他DIV。

3 回复 | 直到 10 年前

BrunoLM 16 年前

使用回拨

$(this).css('z-index',14)
    .fadeTo('slow', 0.5 )
    .fadeTo('slow', 1, function(){
        $(this).css('z-index',zindex);
    });

这个 3rd parameter is a callback function ,它将在动画结束时运行。

Revision #3 on jsBin .

jAndy 16 年前

将代码更改为:

$(".box").click( function () {
   var zindex = $(this).css('z-index');     

   $(this).css('z-index',14).fadeTo  ( 'slow', 0.5 ).fadeTo('slow', 1, function(){
       $(this).css('z-index',zindex);
   });
});

你不能用链子 .css() 方法后 fadeTo() ,因为那些 fx 函数异步运行,因此, CSS() 正在执行。

这就是为什么所有 外汇 方法提供的回调在完成时激发。

请参阅实际操作: http://jsbin.com/eqiti3/2/edit