40 users online (1 members and 39 guests)  

View Poll Results: Do you use AOL?

Voters
26. You may not vote on this poll
  • Yes

    2 7.69%
  • No

    9 34.62%
  • NEVER

    14 53.85%
  • MAYBE

    1 3.85%

  Results 1 to 11 of 11

Related

  1. CSS 3.0 Background Properties    Forum: CSS Forum
    Replies: 2
  2. Replies: 2
  3. Replies: 7
  4. Picture Properties    Forum: CSS Forum
    Replies: 7
  5. new window properties    Forum: HTML Forum
    Replies: 2
  1. #1
    Yanowhiz's Avatar
    New User

    Status
    Offline
    Join Date
    Jul 2002
    Posts
    1

    Post Table Properties

    14 Comic Sans Herif Green I need to know how to make a table that has the top row stay at the top of the page while scrolling down. This is used for long webpages. Please let me know how to do this.

  2. #2
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    Sounds more like a frames question. Never heard of <TABLE>s
    doing what you want.

  3. #3
    Doorknob's Avatar
    Super Newbie

    Status
    Offline
    Join Date
    Jun 2002
    Location
    Malaysia
    Posts
    316

    RE

    a static layer works too

  4. #4
    QuietDean's Avatar
    Administrator

    Status
    Offline
    Join Date
    Oct 2000
    Location
    Bournemouth, UK
    Posts
    2,662
    Hiya mate.

    How about posting a link to an example so we can see what you mean? thanks.
    If one of our members helps you, please click the icon to add to their reputation!
    No support via email or private message - use the forums!
    Before you ask, have you Searched?

  5. #5
    Derek's Avatar
    Be Yourself

    Status
    Offline
    Join Date
    Aug 2001
    Location
    St. George, Utah, USA
    Posts
    466
    iframes?

  6. #6
    nitewing's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Sep 2002
    Location
    Panama City, Florida
    Posts
    139
    Try Dynamic drive website...they have some great menus that stay at the top or the bottom when scrolling.

    Not a table but the same principle.

    the code is in dhtml and it is cut and paste

    nitewing
    Ann/nitewing

  7. #7
    ianru's Avatar
    Junior Member

    Status
    Offline
    Join Date
    Sep 2002
    Posts
    61
    I only know how to make it in frames, you can go to http://www.gaming-power.76h.com and tell me if the thing on top is what you need or not, if you look around you will see that the top always stays on top

  8. #8
    nitewing's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Sep 2002
    Location
    Panama City, Florida
    Posts
    139
    Definitly a part of frames or an iframe....did not check source.

    but the tip on dynamic drive works also or you could simply use an iframe.


    nitewing
    Ann/nitewing

  9. #9
    millimeter's Avatar
    New User

    Status
    Offline
    Join Date
    Apr 2003
    Location
    Barrie ON Canada
    Posts
    1
    I am new to this forum and have no idea how old this thread is, but I'm going to take a shot at it anyway.

    Could you not put this in a span element and us a small javascript to track it's position as the page scrolled?

    Millimeter

  10. #10
    Android's Avatar

    Status
    Offline
    Join Date
    Oct 2002
    Location
    I AM CANADIAN
    Posts
    440

    Talking

    It's funny what you find on your harddrive when you've got time to spare.
    Could something like this be modified to do what you want? I can't remember where I got it, but at the time I thought it was really cool:
    Code:
    <html>
    <head>
    <title>Rolling Table</title>
    </head>
    <body>
    Lock Table Headings<br />
    We'll create the 'locked headings' effect by making the table body scrollable. In other words, by manipulating a scrollbar, we'll be able to slide the table rows under/from the table heading. Exactly what we want right?
    <br>
    Luckily, CSS2 allows to achieve this effect very easily, by the overflow property for block elements. The property allows us to tell what happens if the content overflows the block element's predefined dimensions.
    <br>
    Using 'overflow', we tell that the table body part should be scrolled if necessary.
    Here's the table:
    <br>
    
    
    <table width="400px" border="4" title="Table Heading">
    <tr><th>The amazing rolling table!!!</th></tr>
    </table>
    <div style="width: 400px; height: 100px; overflow: auto">
    <table width="380px" border="4" title="Table Body">
      <tr><td>Item 1</td></tr>
      <tr><td>Item 2</td></tr>
      <tr><td>Item 3</td></tr>
      <tr><td>Item 4</td></tr>
      <tr><td>Itemb5</td></tr>
      <tr><td>Item 6</td></tr>
      <tr><td>Item 7</td></tr>
      <tr><td>Item 8</td></tr>
    </table>
    </div>
    
    The code wraps the table body in a div element with fixed dimensions, and sets its overflow property to auto. This will make the scrollbar appear only if necessary.<br>
    Also, we need to manually dimension the 'Table Heading' table exactly as wide as the 'Table Body' table.<br>
    Finally, notice that we made the div element wide enough to accommodate both the table body and the scrollbar. Know that some people change their scroll bar dimensions, so you'll want to leave sufficient space here.<br>
    
    The result shows as expected (only in browsers that implement this CSS2 spec., meaning MSIE4+, but no Netscape Navigator 4.7).<br><br>
    
    Have fun with locked headings!
    </body>
    </html>
    OOPS sorry 'bout my C&P gaff!

  11. #11
    benzden's Avatar
    Senior Member

    Status
    Offline
    Join Date
    Feb 2002
    Location
    San Antonio, Texas
    Posts
    652
    Try this version, too:

    <br><table width=400px border=1 title=Table Heading>
    <tr><th>The amazing rolling table!!!</th></tr>
    <TR><TD>
    <div style="width: 400px; height: 100px; overflow: auto">
    <table width=380px border=0 title=Table Body>
    <tr><td>Item 1</td></tr>
    <tr><td>Item 2</td></tr>
    <tr><td>Item 3</td></tr>
    <tr><td>Item 4</td></tr>
    <tr><td>Itemb5</td></tr>
    <tr><td>Item 6</td></tr>
    <tr><td>Item 7</td></tr>
    <tr><td>Item 8</td></tr>
    </table>
    </div>
    </TD></TR>
    </TABLE>


    Add BGcolor=ff0000 to each <TD ...> column cell with different colors for each for more possibilities. Am pondering a use for his at my own sites - maybe a picture pop-up alternative to the <FORM><SELECT ...> method.
    Last edited by benzden; 04-11-2003 at 10:01 AM.



Tags for this Thread