Kann ich ein Anker-Tag über ein anderes Anker-Tag legen?

Ich benutze das Karussell von Bootstrap 3 und die Karussellsteuerung auf der rechten Seite überlagert einige Absätze. Normalerweise ist das kein Problem. Einige Folien haben jedoch Links und ich möchte, dass der Benutzer sie immer noch anklicken kann.Kann ich ein Anker-Tag über ein anderes Anker-Tag legen?

Ist es möglich, den Z-Index der Anker-Tags (und nur der Anker-Tags) in den Absätzen so festzulegen, dass sie auf der Seite "höher" sind als das Karussell-Steuerelement?

Bootply mit Beispielcode: http://www.bootply.com/6rOo9TcCNF

Dank!

Quelle

2015-05-12 kjw

es möglich sein kann, aber z-index ist ein heikeler Schmerz ... die Regel, was spätestens in dem DOM ist oben sein ... – DrCord

Ah Gotcha. Ja, die Karussellsteuerelemente kommen später im HTML, damit sie oben sind. – kjw

Ja, wenn Sie die DOM-Reihenfolge ändern, wird es die letzten Elemente über andere Sachen setzen, wenn das für Sie machbar ist, kann es am einfachsten sein. Z-Index könnte funktionieren, ist aber in der Regel eine Super-PITA ... Wenn Sie am Ende mit Z-Index enden beachten Sie, dass Sie es für jedes Element benötigen, das Sie die Stapelung von steuern möchten und dass Z-Indizes positive ganze Zahlen haben . – DrCord

Ich denke, Sie wäre am besten, nur die Breite von carousel-control zu etwas wie 35px zu reduzieren und geben Sie Ihren Folien ein wenig zusätzliche Polsterung, so dass der Inhalt zum Klicken zugänglich ist.

Oder

Eine weitere Alternative wäre der Folie zu geben, verbindet eine hohe z-index und versuchen, es auf diese Weise, so dass sie die carousel-control überlappen, aber das könnte sich einige Probleme mit sich bringt.

Quelle

2015-05-13 15:20:42 DCdaz

Dies löst das Problem, dass Links vollständig hinter den Karussellsteuerelementen liegen. Vielen Dank. – kjw

Außer mit dem Code, den Sie hatten, müssen Sie auch Ihre Chevron-Prozentsatz-Platzierung entfernen, wie ich unten gezeigt habe. Ohne dies zu tun, prev. und die nächsten Icons werden nach außen fließen und nur halb sichtbar sein. –

Ich denke, das ist ziemlich offensichtlich. keine Sorgen KJW freut sich, dass Sie sortiert sind. – DCdaz

Anstatt die Position der Karussellsteuerungssymbole zu ändern, ändern Sie einfach die Breite Ihrer Karussellsteuerung auf die Breite der Symbole und es sollte Ihr Problem beheben. Also zuerst entfernen:

.carousel-control .icon-next, .carousel-control .glyphicon-chevron-right { 
    right:15%; 
} 
.carousel-control .icon-prev, .carousel-control .glyphicon-chevron-left { 
    left:15%;

Dann hinzufügen; } .carousel-control {width:30px!important;} Hier ist die neue bootply http://www.bootply.com/EMilPfoDoK

Quelle

2015-05-13 16:39:19

Kann ich ein Anker-Tag über ein anderes Anker-Tag legen?

Antwort

Verwandte Themen