przewijanie nakładki div bez przewijania całej strony

Mam stronę główną z pewną zawartością. Mam wtedy wyskakujący modal, który jest dłuższy niż sam ekran, więc muszę go przewinąć, żeby go zobaczyć. Co muszę zrobić w moim CSS, aby przewinąć tylko całą stronę zamiast modalnego?przewijanie nakładki div bez przewijania całej strony

Oto CSS dla modal

#overlay { 
    visibility: hidden; 
    position: absolute; 
    left: 45%; 
    width:auto; 
    border:1px solid #A17E13; 
    height:auto; 
    text-align:left; 
    z-index: 1000; 
} 
#overlay div { 
    background-color:#FCFBEC; 
}

Oto HTML:

<html><body> 
    <div>main page</div> 
    <div id="overlay"> 
    <div> 
     <div> 
      <asp:Label ID="test">Text for modal here</asp:Label> 
     </div> 
    </div> 
    </div> 
</body></html>

Źródło

2013-02-26 user541597

gdzie jest reszta kodu. Z tym, co pokazujesz, niemożliwe jest zobaczenie twojej struktury. –

to wszystko. Struktura jest prosta główny div, a następnie oddzielny div dla modalu. – user541597

możesz ograniczyć swój modalny rozmiar tylko do rozmiaru ekranu i nie większy? –

ma całą stronę nie być przewijane wyjątkiem div modalnej? jeśli tak, to możesz spróbować pozycji: naprawiony; na stronie. modal musi znajdować się na zewnątrz z pozycją: absolutną;

<!DOCTYPE html> 
<html> 
<head> 
<style type="text/css"> 
#overlay { 
    /*visibility: hidden;*/ 
    position: fixed; 
    left: 45%; 
    width:auto; 
    border:1px solid #A17E13; 
    height:900px; 
    text-align:left; 
    background-color:orange; 
} 
.scroller { 
    height:3000px; 
    width:400px; 
    background-color:green; 
} 
</style> 
</head> 
<body> 
    <div id="overlay"> 
     this is not moving 
    </div> 

    <div> 
     <div class="scroller"> 
      <asp:Label ID="test">This is moving if big enough</asp:Label> 
     </div> 
    </div> 
</body> 
</html>

Fiddle here

Źródło

2013-02-26 21:32:55 caramba

przewijanie nakładki div bez przewijania całej strony

Odpowiedz

Powiązane problemy