2011-10-17 4 views
0

私はそれぞれがZ-インデックススコアを持つ5つのdivボックスを持っています。jQueryとZ-インデックスリセット

DIV1 - z屈折率:0

DIV2 - z屈折率:-1

DIV3 - z屈折率:-2

DIV4 - z屈折率:-3

DIV5 - z屈折率:-4

DIV6 - z屈折率:-5

私は番目を変更するためにjQueryを使用しますクリック時のインデックス。したがって、たとえば:

$("#div2").click(function() { 
    $("#div1").css("z-index","0"); 
    $("#div3").css("z-index","-2"); 
    $("#div4").css("z-index","-3"); 
    $("#div5").css("z-index","-4"); 
    $("#div6").css("z-index","-5"); 

    $("#div2").css("z-index","1"); 

}); 

これは明らかに他のすべてのボックスの前にdiv2ボックスを表示します。私は次のことを行う必要があり、別のボックスに行きたい場合は

は今:

$("#div3").click(function() { 
    $("#div1").css("z-index","0"); 
    $("#div2").css("z-index","-1"); 
    $("#div4").css("z-index","-2"); 
    $("#div5").css("z-index","-4"); 
    $("#div6").css("z-index","-5"); 

    $("#div3").css("z-index","1"); 

}); 

私は、元の値を定義し、その後、私は上場最高をしたいボックスを再定義する必要があります。それらを最初の値に戻す方法はありますか?そうすれば、私はうまくいけば私はいくつかのリセットを避けることができますか?うまくいけばこのように見えます:

$("#div3").click(function() { 
    $("div").css("original css z-index values"); 

    $("#div3").css("z-index","1"); 

}); 

ありがとう!!!

答えて

1

$ .dataを使用して最初の初期値を保存し、リセットするたびに$ .dataの値を設定できます。

p.s.

私は、あなたが-1を置く理由を理解しない-2等...

あなたは1層まで、他のすべての層を有していなければならない - 低い数字で(同一であってもよい)

ので、いくつかを置きます全てのdiv上のクラス(「lowZ」クラス)を定義:Zインデックス:0

とで活性層に活性なクラス(「HIGHZ」)を置く:次いで999

をその都度:Zインデックスdo:

$(".divClass").removeClass("highZ"); 
$("#div2").addClass("highZ"); 
+0

異なるZ-インデックス(-1、-2など)があるのは、divボックスがページの周りにコラージュされているためです。だから、それは他のものの上にあるコーヒーテーブルの雑誌のように見えます。 –

+0

ですので、$ .dataを使用してください –

+0

私はそれを打つつもりです。ありがとう! –

関連する問題