Select DIV mit höchsten Z-Index

Beispiel-Code, so kann ich erklären, dieses Problem starten:Select DIV mit höchsten Z-Index

<div style="z-index:5">5</div> 
<div style="z-index:2">2</div> 
<div style="z-index:1">1</div> 
<div style="z-index:4">4</div> 
<div style="z-index:3">3</div>

(. Z-Index-Werte sind nicht wichtig, und deren Reihenfolge, noch weniger nur Beispiel-Code)

Problem: Ich möchte (mit CSS oder JS mit jQuery) das DIV mit dem höchsten Z-Index-Wert auswählen. Im obigen Fall möchte ich den ersten auswählen, weil der Z-Index 5 höher ist als alle anderen Z-Indizes.

Gibt es eine Möglichkeit, dies zu tun? Zusätzliche Informationen: Ich schreibe einen Simple Window Manager mit jQuery + jQuery UI, und die Z-Indizes werden von der Stapeloption in .raggable zugewiesen. Ich kann anscheinend keine Möglichkeit finden, jQuery dazu zu bringen, dem zuletzt gezogenen Element eine Klasse zuzuweisen, also gehe ich nach dem höchsten Z-Index-Weg. Irgendwelche Hilfe bitte? Vielen Dank.

Quelle

2010-01-05 Jimmie Lin

Ich bin sicher, dass Sie die Stopp-Ereignis verwenden könnte Zugriff auf die kürzlich gezogene Element zu gewinnen, das heißt:

$('.selector').draggable({ 
    stop: function(event, ui) { 
     $(event.target).addClass('justDragged'); 
    } 
});

Wenn Sie alle sehen Funktionen/Variablen, die an Ereignisse gebunden sind, können Sie Folgendes verwenden:

var str = ''; 
for (i in event) { 
    str += i + ', '; 
} 
alert(str);

Dies sollte Ihnen einen guten Hinweis darauf geben, was Ihnen in einer beliebigen Anzahl von jQuery-Callback-Parametern zur Verfügung steht.

Quelle

2010-01-05 11:48:14

Ich hätte die Seite aktualisieren sollen - es wird immer eine gute Antwort hier bei SO geben, anscheinend! (obwohl ich einen anderen Start als Stop verwendet habe, der das 'Windowing' Verhalten nachbildet) Akzeptiert :) –

Sie können immer gegen jQuery(".yourDivs").css("z-index") testen, sobald Sie die Klasse für alle Ihre divs hinzugefügt haben.

Quelle

2010-01-05 11:33:10 marcgg

Sie meinen, dass ich alle Elemente durchlaufen muss, mit denen ich den Z-Index vergleichen und den höchsten speichern möchte? Da ich einen Window-Manager schreibe, ist es möglicherweise ein wenig ineffizient, jedes Mal, wenn ein Ziehen ausgeführt wird, aufzurufen, und wenn es viele divs gibt, sogar noch ineffizienter. –

Ja, das wird nicht effizient sein, aber Sie sollten in Erwägung ziehen, eine separate Datenstruktur zu verwenden, um das zu erreichen, was Sie erreichen möchten (ein separater Stack, der darüber informiert, was darüber liegt). Mit zindex bezweifle ich, dass Sie einen besseren Weg bekommen würden. – marcgg

In Ihrem Ort würde ich einfach Ereignis onclick auf jedem div anhängen. Ich denke, dann wird Javascript oder jQuery automatisch die ZIndex-Informationen berücksichtigen, und Sie erhalten das Ereignis genau auf DIV, wo Sie geklickt haben.

Quelle

2010-01-05 11:36:56 user218447

Versuchen Sie es hier:

How can you figure out the highest z-index in your document?

Quelle

2010-01-05 11:37:11 graphicdivine

Danke, aber der oben genannte erfordert immer noch das Durchlaufen aller Elemente, wie ich oben eine Antwort kommentierte, also warte ich auf einen besseren Weg. –

Ich habe gerade herausgefunden, dass es ein "start draging" -Ereignis in .raggable gibt. Wie dumm von mir.

 
$("#window-"+id+".staticwindow.stwin").draggable({ 
... 
    start: function(e, u){ 
     $(".window").removeClass('active'); 
     $(this).addClass('active'); 
    } 
});

Obwohl dieser Ansatz von mir nicht mehr mit meiner ursprünglichen Frage verwandt ist, gibt es zumindest keine Schleifen. Ich werde keine Antwort akzeptieren, weil dies eine Schleife zu brauchen scheint. (Obwohl ich etwas geneigt bin, die Antwort von zarko-o zu akzeptieren, weil es mich dazu bringt, an Ereignissen zu denken)

Vielen Dank für Ihre Antworten!

Quelle

2010-01-05 11:52:47

Select DIV mit höchsten Z-Index

Antwort

Verwandte Themen