Søg
Avatar billede ghazaleh Nybegynder
10. juli 2003 - 16:07 Der er 1 kommentar og
1 løsning

Teksten skal følge skærmen når man scroller ned

Hej
Jeg har en tabel, hvor første række består af nogle overskrifter og rækkerne nedenunder hører så til disse overskrifter.

Der kan godt komme rimeligt mange rækker, så jeg vil gerne have at overskrifter følger med ned når man scroller ned på siden.

Jeg har set sådan nogle scripts før, men jeg kan ikke lige finde dem. Er der nogle der kan finde et, eller lave et?
Avatar billede ahv Nybegynder
10. juli 2003 - 16:10 #1
Noget ala dette? ->

<html>
<head>

<style type="text/css">
#floater {
    position: relative;
    left: 0;
    top: 0;
    width: 300;
    visibility: visible;
    z-index: 0;
}
</style>

</head>

<body>

<SCRIPT Language="JavaScript">
    self.onError = null;
    currentX = currentY = 0;
    whichIt = null;
    lastScrollX = 0; lastScrollY = 0;
    browserIsNS = (document.layers) ? 1 : 0;
    browserIsIE = (document.all) ? 1: 0;

    function heartBeat()
    {
        if (browserIsIE) {
            diffY = document.body.scrollTop; diffX = document.body.scrollLeft;
        }
        if (browserIsNS) {
            diffY = self.pageYOffset; diffX = self.pageXOffset;
        }
        if (diffY != lastScrollY) {
            percent = .1 * (diffY - lastScrollY);
            if (percent > 0) {
                percent = Math.ceil(percent);
            } else {
                percent = Math.floor(percent);
            }
            if (browserIsIE) {
                document.all.floater.style.pixelTop += percent;
            }
            if (browserIsNS) {
                document.floater.top += percent;
            }
            lastScrollY = lastScrollY + percent;
        }
    }

    if (browserIsNS || browserIsIE) {
        action = window.setInterval("heartBeat()",20);
    }
//  -->
</SCRIPT>

            <div id="floater">

<font size="-2" face="Verdana" color="3399cc">SCROLL :o)</font>

            </div>

<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
hej hej hej hej
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
</body>
</html>
Avatar billede roenving Novice
10. juli 2003 - 17:16 #2
Du kan lave det ved at splitte tabellen op og sætte dem ind i nogle elementer, hvoraf dit element med alle rækkerne skal kunne scrolles ,-)

-- her har jeg puttet noget tabelværk ind i nogle <div>s -- bemærk dog, at det kræver absolut bredde på kolonnerne !-)

Af illustrative grunde er den næsten uendelig lang ...

<DIV ALIGN="left">
<table width="600" border="1" style="text-align:center;">
    <tr bgcolor="#FFFF00">
        <td width="100">Overskrift 1</td>
        <td width="100">Overskrift 2</td>
        <td width="100">Overskrift 3</td>
        <td width="100">Overskrift 4</td>
        <td width="100">Overskrift 5</td>
        <td width="100">Overskrift 6</td>
    </tr>
</table>
</div>
<div STYLE="overflow:auto;height:400px;" ALIGN="left">
<table width="600" border="1" style="text-align:center;">
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#8080FF">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
    <tr bgcolor="#80FF80">
        <td width="100">Dette er en tekst 1</td>
        <td width="100">Dette er en tekst 2</td>
        <td width="100">Dette er en tekst 3</td>
        <td width="100">Dette er en tekst 4</td>
        <td width="100">Dette er en tekst 5</td>
        <td width="100">Dette er en tekst 6</td>
    </tr>
</table>
</div>
<div STYLE="overflow:auto;">
<table width="600" border="1" style="text-align:center;">
    <tr bgcolor="#FFFF00">
        <td width="100">Fodtekst 1</td>
        <td width="100">Fodtekst 2</td>
        <td width="100">Fodtekst 3</td>
        <td width="100">Fodtekst 4</td>
        <td width="100">Fodtekst 5</td>
        <td width="100">Fodtekst 6</td>
    </tr>
</table>   
</div>
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra JavaScript kategorien

Titel Indlæg Oprettet Seneste aktivitet
problem med download i <a href=" " download> tag i JavaScript Af Peer i JavaScript 5 27/04/202620:09 21/08/202610:41
Validering af filnavn i formular Af Strawberry i JavaScript 8 14/04/202610:11 20/04/202611:14
Mangler et JavaScript til htm side med iframe i Joomla5 Af Peder Lund Nielsen i JavaScript 2 03/02/202614:19 04/04/202616:02
Åbne en PDF fil fra en mappe Af mbl i JavaScript 9 18/04/202516:52 22/04/202512:33
Spørgsmål til cookies Af Mads i JavaScript 2 14/02/202511:47 27/06/202514:34
Se alle spørgsmål i kategorien Opret spørgsmål

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
27/0821:03 Kan man få Word viewer gratis Af Strawberry i Word
26/0813:28 Findes der en brugsanvisning til : "ONKYO Stereo Casette - Tape Deck - R1" Af Ikke-ekspert i Musik & videoafspillere
24/0820:07 Libra Office 26.2.5.2 - Er sort - Kan an ændre til lysere baggrund ? (Windows 11) Af Ikke-ekspert i Office & Kontorpakker
24/0811:24 Hvor kan jeg finde hjælp til at flytte fra min gamle Samsung Flip4 til min nye Samsung Galaxy S24 Af vbr i Apps til Android
24/0811:16 problem med mailbesked Af Pestilensen i Excel
White papers
Flere white papers »