overlay eine div über eine andere mit css
Ich habe ein wrapper-div, das einige css-Eigenschaft festgelegt. auf einen Klick ich habe zu zeigen, eine zu mit eine Nachricht.
<div class="dvLanding">
<div class="popupArea">
<span class="VoteOnce">You can only vote once.</span> <a style="vertical-align: top">
<img alt="close" src="../../Images/error1-exit-button.png" /></a></div></div>
</div>
meine css-Klassen.
.dvVoteWrapper
{
background-color: #949494;
opacity: 0.5;
filter: Alpha(opacity=50);
display:none;
width: 1024px;
height: 768px;
position: absolute;
}
.popupArea
{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
.dvLanding
{
background-image: url(/Images/screen1-bg-logos.jpg);
background-repeat: no-repeat;
position: absolute;
width: 100%;
height: 100%;
}
.VoteOnce
{
font-family: Calibri regular;
font-size: 24pt;
background-image: url(/Images/error1-vote-once-bg.png);
background-repeat: no-repeat;
width:288px;
height:74px;
color: #000000;
}
ich bin das entfernen die display:none
- Attribut mit jquery. Bei der Anwendung dieser Klassen ist es nicht für die komplette Seite und suchen verzerrt. freundlich darauf hin, wie dies zu tun. für ein besseres Verständnis ich anbei die screenshots
versuchen Sie, die hand auf dem z-index und "Deckkraft" zusammen..
was ich will ist, legen Sie das overlay über den gesamten Bildschirm und das gelbe Bild auf der Oberseite des Overlays mit der Kreuz-Taste auf der oberen rechten Seite des gelben Bildschirm.
mögliche Duplikate von Wie overlay ein div über anderen div
was ich will ist, legen Sie das overlay über den gesamten Bildschirm und das gelbe Bild auf der Oberseite des Overlays mit der Kreuz-Taste auf der oberen rechten Seite des gelben Bildschirm.
mögliche Duplikate von Wie overlay ein div über anderen div
InformationsquelleAutor ankur | 2013-02-12
Schreibe einen Kommentar Antworten abbrechen
Du musst angemeldet sein, um einen Kommentar abzugeben.
Hier ist noch ein
HTML:
CSS:
JSFiddle für die Prüfung.
InformationsquelleAutor Olaf Dietsche
Wenn Sie möchten, dass der wrapper zur Abdeckung des gesamten Bildschirms, die Sie verwenden können:
Ihre
z-index
Eigenschaft werden müssen, höher ist als alle Elemente darunter, die Sie versuchen, zu deckennicht bekommen Sie können Sie mir sagen, wie zu tun, dass ich meine welche Veränderungen muss ich in meinem css-Klasse. auch das gelbe Bild auf der Oberseite des Overlays mit der Kreuz-Taste auf der oberen rechten Seite des gelben Bildschirm. jetzt das gelbe Bild ist auf der Suche transparnet....
Es ist, weil Sie haben Ihren
.dvVoteWrapper
div transparent, so dass alles transparent sein wird (sind Sie in der Lage, verschieben Sie diese in Ihrem Haupt-Körper-tag), wenn Sie möchten, eine transparente Hintergrundfarbe haben Sie einen Blick auf diese post stackoverflow.com/questions/14830186/...ok also ich habe die kleine gelbe Teil aus der Umhüllung , und erhöht den z-index die höchsten unter allen Elementen. Also im FF ist es perfekt Aussehen . Aber im IE ist es sill mir problem.
Ich meinte verschieben Sie den wrapper in den <body>
InformationsquelleAutor Pete