Gibt es in jQuery eine Möglichkeit, ein div nach vorne zu bringen?

Wenn ich eine Menge absolut positionierter Divs hätte und sie sich überlappen würden, wie würde ich dann ein bestimmtes Div nach vorne bekommen? Danke nochmal Jungs!Gibt es in jQuery eine Möglichkeit, ein div nach vorne zu bringen?

Quelle

2010-07-13 anthonypliu

Verwenden Sie Z-Index mit Css ... – Reigel

Dies ist eine CSS-Sache, keine jQuery Sache (obwohl Sie jQuery verwenden können, um die CSS zu ändern).

$('element').css('z-index', 9999); // note: it appears 'zIndex' no longer works

Oder wird die absolute Positionierung etwas nach oben bringen:

$('element').css('position', 'absolute');

Quelle

2010-07-13 00:05:35

Ich denke, Sie werden beide, also Position: absolute UND z-inde: 1 –

vereinbart, aber das gehört wirklich in der CSS, es sei denn, Sie reagieren auf Benutzerinteraktionen –

Es scheint, als wolle er dies dynamisch tun und will wissen, ob jQuery hat diese Funktionalität. – Greg

Verwenden Sie .css() und wenden Sie das Positionsattribut und das Z-Index-Attribut an.

Quelle

2010-07-13 00:05:29 airmanx86

Alternativ wenden Sie eine Klasse, die das Attribut, das Sie benötigen, mit jQuery. – airmanx86

Es wäre zu viel des Guten jQuery für diesen Einsatz. Stattdessen CSS‘z-index property:

<style type="text/css"> 
    #myElement { 
    z-index: 50000; 
    } 
</style>

Quelle

2010-07-13 00:29:59

Ich stimme dieser Antwort zu, aber es klingt, als ob die Frage darin besteht, ein bestimmtes div (von überlappenden divs) nach vorne zu bringen. Wenn Sie ein bestimmtes div im statischen Markup nach oben setzen, wird das Problem nicht gelöst. –

5 Jahre später. Wie bringe ich ein div nach vorne? Antwort: 'z-index: 5000000000000;' – teynon

Grundsätzlich muss es 1 höher als der höchste 'z-index' auf der Seite sein. –

Wenn Sie mit mehreren Elementen arbeiten Sie durch eine Schleife haben werden und sehen, welche den höchsten Z-Index hat, und stellen Sie die oben auf dieser + 1.

http://jsfiddle.net/forresto/Txh7R/

var topZ = 0; 
$('.class-to-check').each(function(){ 
    var thisZ = parseInt($(this).css('zIndex'), 10); 
    if (thisZ > topZ){ 
    topZ = thisZ; 
    } 
}); 
$('.clicked-element').css('zIndex', topZ+1);

Für eine nicht-CSS-Version (wenn keine der Schichten z-Index angegeben haben) können Sie auch nur das Element anhängen wieder:

$('.click-to-top').click(function(){ 
    $(this).parent().append(this); 
});

(Ich weiß nicht, ob das langsamer ist als mit CSS z-index.)

Für nicht-CSS non-jQuer y, hängen Sie es einfach wieder:

// var element = document...; 
element.parentNode.appendChild(element);

Quelle

2012-10-28 20:29:23 forresto

Dies ist eine hilfreiche Antwort für diejenigen, die etwas dynamisches möchten, insbesondere wenn Sie ziehbare Elemente verwenden. – dennisbest

fehlendes '$' Zeichen ??? - $ (this) .parent(). append ($ (this)); ??? – Atara

Nein, '$(). Append (Element)' funktioniert. – forresto

Mit jQuery (wie Sie gefragt):

$('#a-div').parent().append($('#a-div')); // Pop a div to the front

Seltsam, wie jeder mit Z-Index ging. Warum sollten Sie die natürliche Stapelreihenfolge außer Kraft setzen, wenn Sie sie einfach im DOM nach vorne schieben können?

Quelle

2013-07-23 20:19:03 Yarin

Ehrfürchtige Idee und Ansatz, yeh es ist komisch, für Z-Index zu gehen, wenn dieser Ansatz existiert, und ich akzeptiere, dass das erste, was in meinem Kopf kam, war z-index: $ –

Ist dieser Ansatz mehrere Elemente des Kindes angehängt angehängt ? Bitte klären Sie das für mich. – qualebs

@qualebs nein, es ist ein vorhandenes Element zu greifen und es an die Spitze der Stapelreihenfolge zu bewegen – Yarin

Gibt es in jQuery eine Möglichkeit, ein div nach vorne zu bringen?

Antwort

Verwandte Themen