html - overflow:auto; hvordan flytter jeg den - Udvikleren.dk

Tags: overflow css html

Bruger #16610 @ 25.08.11 15:00

Jeg har en DIV, hvor jeg bruger overflow:auto;, det giver jo en scrollbar, på selve diven, men vil gerne have at det er "hoved" scrollbaren, altså den der normalt er der, er den der flytter på indholdet i DIV´en, ligesom her:
http://i-donline.com/

5 svar postet i denne tråd vises herunder
0 indlæg har modtaget i alt 0 karma

Sorter efter stemmer Sorter efter dato

Bruger #10216 @ 25.08.11 15:22

4.283

Prøv at lege lidt med position:fixed
http://www.quirksmode.org/css/position.html

Bruger #16610 @ 25.08.11 15:29

Kender godt position:Fixed, men hvordan rammer jeg Scrollbaren?

Bruger #955 @ 25.08.11 15:42

1.624

Jeg har en DIV, hvor jeg bruger overflow:auto;, det giver jo en scrollbar, på selve diven, men vil gerne have at det er "hoved" scrollbaren, altså den der normalt er der, er den der flytter på indholdet i DIV´en, ligesom her:
http://i-donline.com/

Måske er det ikke indholdet i DIV'en der flytter sig, men alt andet der står stille.

Bruger #16610 @ 25.08.11 15:44

Jeg har en DIV, hvor jeg bruger overflow:auto;, det giver jo en scrollbar, på selve diven, men vil gerne have at det er "hoved" scrollbaren, altså den der normalt er der, er den der flytter på indholdet i DIV´en, ligesom her:
http://i-donline.com/

Måske er det ikke indholdet i DIV'en der flytter sig, men alt andet der står stille.

Hehe læste det først som en Joke, men ved nærmere eftertanke giver det jo meget godt mening.

Men hvad gør jeg for at det vil virke?
Fixed?

Bruger #955 @ 25.08.11 18:43

1.624

Men hvad gør jeg for at det vil virke?
Fixed?

Fixed placerer elementer i forhold til skærmen. Om du scroller betyder intet. Så dette kan du bruge til det indhold, der skal være omkring den "scrollbare div".

Et meget grovt oversimplificeret eksempel:

HTML kode

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
 <html>
 <head>
 <style type="text/css">
 <!--
 
 #topElement {
     top: 0px;
     left: 0px;
 
     border: 1px solid #6374AB;
     z-index: 5;
     position: fixed;
     width: 100%;
     height: 200px;
     }
 #leftElement {
     top: 200px;
     left: 0px;
 
     border: 1px solid #6374AB;
     z-index: 5;
     position: fixed;
     width: 200px;
     height: 500px;
     }
  #content
  {
         border: 1px solid #55ee7B;
         height: 2000px;
         position: absolute; 
         left: 205px;
         top: 205px;
  }
         
 -->
 
 </style>
 </head>
 <body>
 <div id="topElement">
 dette er topelement
 </div>
 <div id="leftElement">
 dette er leftelement
 </div>
 <div id="content">
 dette er meget langt indhold
 <br /><br />blabla
 <br /><br />blabla
 <br /><br />blabla
 <br /><br />blabla
 </div>
 
 </body>
 </html>

overflow:auto; hvordan flytter jeg den

Karma barometer (30 dage)

Modtaget

Givet

Favorit hos
Forum tråde
Artikler