Dynamisk tekst scroller

som på www.soze.dk/blaa-bog/ ?

det er også muligt at få en scroller til at skifte farve på en frame /hele vinduet
det er et java som kan henter på www.script.dk
men det virker kun med explorer 5.5
eller du kan opretter knapper der føre til et givent punkt i dit dokument

så skal du arbejde i frames

Man skal kunne scrolle op/ned via pile (grafikker). Ingen frames.

kunne noget som mit bruges? det er bygget op vha. tabeller..

... dog vil det så ikke virke specielt optimalt i NS

http://www.dynamicdrive.com/dynamicindex10/index.html
her er forskellige metoder at lave effekter med teksten (inkl. demoer)

keysersoze - jeg tror desværre ikke rigtigt jeg kan bruge dit til noget. Vil gerne undgå scroll baren ser du. Ser ud til at jeg må ty til frames. AK.

undgå scrollbaren - men du skriver at du vil have en scrollbar... ved frames får du da en total identisk scrollbar

ellers må du lige forklare nærmere...

Idéen var at få teksten til at scrolle ved mouseOver på pile grafikker jeg selv laver og ikke den gængse scrollbar.  Se http://www.onm.dk/eksperten/
Har fundet ud af at det lader sig fint gøre i frameset - så det må blive løsningen. Ville bare osse gerne have undgået frames.

Kun med pile:

http://www.assembler.org

Med dragndrop:

http://ghtml.com/showoff/scrollbar


/Geeeet

Måske kan du bruge noget af det her. Det er en hel siden uden scrollbar og med knapper man klikker på, men det er jo til at lave om på.

<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.0//EN\">
<HTML>
<HEAD>
<!-- Minus AutoDato -->
    <TITLE>[Ingen titel]</TITLE>
<META NAME=\"Generator\" CONTENT=\"Stone\'s WebWriter 3.5\">
<SCRIPT TYPE=\"text/javascript\">
function ned(a,b){
parent.scrollBy(a,b)
}
function op(a,b){
parent.scrollBy(a,b)
}
</SCRIPT>
<SCRIPT LANGUAGE=\"JavaScript\">

<!-- Begin
function setVariables() {
if (navigator.appName == \"Netscape\") {
v=\".top=\";
dS=\"document.\";
sD=\"\";
y=\"window.pageYOffset\";
}
else {
v=\".pixelTop=\";
dS=\"\";
sD=\".style\";
y=\"document.body.scrollTop\";
  }
}
function checkLocation() {
object=\"object1\";
yy=eval(y);
eval(dS+object+sD+v+yy);
setTimeout(\"checkLocation()\",10);
}
//  End -->
</script>

</HEAD>
<BODY  OnLoad=\"setVariables();checkLocation()\" scroll=\"NO\">
<div id=\"object1\" style=\"position:absolute; visibility:show; left:5px; top:0px; z-index:2\">
<A HREF=\"#\">
<form><input type=button value=\"Ned\" onClick=\"ned(1,400)\"></form>
<form><input type=button value=\"Op\" onClick=\"op(1,-400)\"></form>
</A>
</div>

1<BR>2<BR>3<BR>4<BR>5<BR>6<BR>7<BR>8<BR>9<BR>10<BR>11<BR>12<BR>13<BR>14<BR>15<BR>16<BR>17<BR>18<BR>19<BR>20<BR>21<BR>22<BR>23<BR>24<BR>25<BR>26<BR>27<BR>28<BR>29<BR>30<BR>31<BR>32<BR>33<BR>34<BR>35<BR>36<BR>37<BR>38<BR>39<BR>40<BR>41<BR>42<BR>43<BR>44<BR>45<BR>46
</BODY>
</HTML>

Sorry - har ikke rigtig kunne finde noget brugbart og har nu fundet en anden løsning - men TAK

Hey Geeeet!!!... Kan man få koden til den der Scroll?

her::



<script language=\"javascript\">
// Made by geeeet@ghtml.com
// Keep these two lines and you\'re free to use this code

// Known bugs :
// If ie4.5 mac, please press apple-t to remove sidebar, otherwise everything is pushed 20px to the right...

// Corrected bugs :
// 25.01.2001 - When the height of the span \"content\" was less than the height of the span \"contentClip\" a javascript error occured, function changed : move()
// 21.02.2001 - Scrolling text wasn\'t selectable in ie, function changed : move()
// 05.03.2001 - Ie x and y coordinates was wrong when page was scrolled, function changed : getMouse()

// 19.04.2001 - Finally able to remove browser-scrollbar if content is longer than the browser is high:
// Just put this in the style-tag right before the end head-tag:
// body {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0; width:100%;height:100%;overflow:hidden}

// Touch me here :-)
var upH = 18; // Height of up-arrow
var upW = 12; // Width of up-arrow
var downH = 18; // Height of down-arrow
var downW = 12; // Width of down-arrow
var dragH = 26; // Height of scrollbar
var dragW = 17; // Width of scrollbar
var scrollH = 161; // Height of scrollbar
var speed = 4; // Scroll speed

// And now... go to the bottom of the page...

// Browser detection
var dom = document.getElementById ? true:false;
var nn4 = document.layers ? true:false;
var ie4 = document.all ? true:false;

var mouseY; // Mouse Y position onclick
var mouseX; // Mouse X position onclick

var clickUp = false; // If click on up-arrow
var clickDown = false; // If click on down-arrow
var clickDrag = false; // If click on scrollbar
var clickAbove = false; // If click above scrollbar
var clickBelow = false; // If click below scrollbar

var timer = setTimeout(\"\",500); // Repeat variable
var upL; // Up-arrow X
var upT; // Up-arrow Y
var downL; // Down-arrow X
var downT; // Down-arrow Y
var dragL; // Scrollbar X
var dragT; // Scrollbar Y
var rulerL; // Ruler X
var rulerT; // Ruler Y
var contentT; // Content layer Y;
var contentH; // Content height
var contentClipH; // Content clip height
var scrollLength; // Number of pixels scrollbar should move
var startY; // Keeps track of offset between mouse and span

// Mousedown
function down(e){
    if((document.layers && e.which!=1) || (document.all && event.button!=1)) return true; // Enables the right mousebutton
    getMouse(e);
    startY = (mouseY - dragT);
   
    // If click on up-arrow
    if(mouseX >= upL && (mouseX <= (upL + upW)) && mouseY >= upT && (mouseY <= (upT + upH))){
        clickUp = true;
        return scrollUp();
    }   
    // Else if click on down-arrow
    else if(mouseX >= downL && (mouseX <= (downL + downW)) && mouseY >= downT && (mouseY <= (downT + downH))){
        clickDown = true;
        return scrollDown();
    }
    // Else if click on scrollbar
    else if(mouseX >= dragL && (mouseX <= (dragL + dragW)) && mouseY >= dragT && (mouseY <= (dragT + dragH))){
        clickDrag = true;
        return false;
    }
    else if(mouseX >= dragL && (mouseX <= (dragL + dragW)) && mouseY >= rulerT && (mouseY <= (rulerT + scrollH))){
        // If click above drag
        if(mouseY < dragT){
            clickAbove = true;
            clickUp = true;
            return scrollUp();
        }
        // Else click below drag
        else{
            clickBelow = true;
            clickDown = true;
            return scrollDown();
        }
    }
    // If no scrolling is to take place
    else{
        return true;
    }
}

// Drag function
function move(e){
    if(clickDrag && contentH > contentClipH){
        getMouse(e);
        dragT = (mouseY - startY);
       
        if(dragT < (rulerT))
            dragT = rulerT;       
        if(dragT > (rulerT + scrollH - dragH))
            dragT = (rulerT + scrollH - dragH);
       
        contentT = ((dragT - rulerT)*(1/scrollLength));
        contentT = eval(\'-\' + contentT);

        moveTo();
       
        // So ie-pc doesn\'t select gifs
        if(ie4)
            return false;
    }
}

function up(){
    clearTimeout(timer);
    // Resetting variables
    clickUp = false;
    clickDown = false;
    clickDrag = false;
    clickAbove = false;
    clickBelow = false;
    return true;
}

// Reads content layer top
function getT(){
    if(ie4)
        contentT = document.all.content.style.pixelTop;
    else if(nn4)
        contentT = document.contentClip.document.content.top;
    else if(dom)
        contentT = parseInt(document.getElementById(\"content\").style.top);
}

// Reads mouse X and Y coordinates
function getMouse(e){
    if(ie4){
        mouseY = event.clientY + document.body.scrollTop;
        mouseX = event.clientX + document.body.scrollLeft;
    }
    else if(nn4 || dom){
        mouseY = e.pageY;
        mouseX = e.pageX;
    }
}

// Moves the layer
function moveTo(){
    if(ie4){
        document.all.content.style.top = contentT;
        document.all.ruler.style.top = dragT;
        document.all.drag.style.top = dragT;
    }
    else if(nn4){
        document.contentClip.document.content.top = contentT;
        document.ruler.top = dragT;
        document.drag.top = dragT;
    }
    else if(dom){
        document.getElementById(\"content\").style.top = contentT + \"px\";
        document.getElementById(\"drag\").style.top = dragT + \"px\";
        document.getElementById(\"ruler\").style.top = dragT + \"px\";
    }
}

// Scrolls up
function scrollUp(){
    getT();
   
    if(clickAbove){
        if(dragT <= (mouseY-(dragH/2)))
            return up();
    }
   
    if(clickUp){
        if(contentT < 0){       
            dragT = dragT - (speed*scrollLength);
           
            if(dragT < (rulerT))
                dragT = rulerT;
               
            contentT = contentT + speed;
            if(contentT > 0)
                contentT = 0;
           
            moveTo();
            timer = setTimeout(\"scrollUp()\",25);
        }
    }
    return false;
}

// Scrolls down
function scrollDown(){
    getT();
   
    if(clickBelow){
        if(dragT >= (mouseY-(dragH/2)))
            return up();
    }

    if(clickDown){
        if(contentT > -(contentH - contentClipH)){           
            dragT = dragT + (speed*scrollLength);
            if(dragT > (rulerT + scrollH - dragH))
                dragT = (rulerT + scrollH - dragH);
           
            contentT = contentT - speed;
            if(contentT < -(contentH - contentClipH))
                contentT = -(contentH - contentClipH);
           
            moveTo();
            timer = setTimeout(\"scrollDown()\",25);
        }
    }
    return false;
}

// reloads page to position the layers again
function reloadPage(){
    location.reload();
}

// Preload
function eventLoader(){
    if(ie4){
        // Up-arrow X and Y variables
        upL = document.all.up.style.pixelLeft;
        upT = document.all.up.style.pixelTop;       
        // Down-arrow X and Y variables
        downL = document.all.down.style.pixelLeft;
        downT = document.all.down.style.pixelTop;
        // Scrollbar X and Y variables
        dragL = document.all.drag.style.pixelLeft;
        dragT = document.all.drag.style.pixelTop;       
        // Ruler Y variable
        rulerT = document.all.ruler.style.pixelTop;       
        // Height of content layer and clip layer
        contentH = parseInt(document.all.content.scrollHeight);
        contentClipH = parseInt(document.all.contentClip.style.height);
    }
    else if(nn4){
        // Up-arrow X and Y variables
        upL = document.up.left;
        upT = document.up.top;       
        // Down-arrow X and Y variables
        downL = document.down.left;
        downT = document.down.top;       
        // Scrollbar X and Y variables
        dragL = document.drag.left;
        dragT = document.drag.top;       
        // Ruler Y variable
        rulerT = document.ruler.top;
        // Height of content layer and clip layer
        contentH = document.contentClip.document.content.clip.bottom;
        contentClipH = document.contentClip.clip.bottom;
    }
    else if(dom){
        // Up-arrow X and Y variables
        upL = parseInt(document.getElementById(\"up\").style.left);
        upT = parseInt(document.getElementById(\"up\").style.top);
        // Down-arrow X and Y variables
        downL = parseInt(document.getElementById(\"down\").style.left);
        downT = parseInt(document.getElementById(\"down\").style.top);
        // Scrollbar X and Y variables
        dragL = parseInt(document.getElementById(\"drag\").style.left);
        dragT = parseInt(document.getElementById(\"drag\").style.top);
        // Ruler Y variable
        rulerT = parseInt(document.getElementById(\"ruler\").style.top);
        // Height of content layer and clip layer
        contentH = parseInt(document.getElementById(\"content\").offsetHeight);
        contentClipH = parseInt(document.getElementById(\"contentClip\").offsetHeight);
        document.getElementById(\"content\").style.top = 0 + \"px\";
       
    }
    // Number of pixels scrollbar should move
    scrollLength = ((scrollH-dragH)/(contentH-contentClipH));
    // Initializes event capturing
    if(nn4){
        document.captureEvents(Event.MOUSEDOWN | Event.MOUSEMOVE | Event.MOUSEUP);
        window.onresize = reloadPage;
    }
    document.onmousedown = down;
    document.onmousemove = move;
    document.onmouseup = up;
}
</script>
<style type=\"text/css\">
    #content {position: absolute;}
    body {margin-left:0; margin-right:0; margin-top:0; margin-bottom:0; width:100%;height:100%;overflow:hidden}
</style>

</head>

<body bgcolor=\"#ffffff\" marginwidth=\"0\" marginheight=\"0\" leftmargin=\"0\" topmargin=\"0\" onLoad=\"eventLoader();\">

<table border=\"0\" cellspacing=\"0\" cellpadding=\"0\">
<tr>
    <td colspan=\"2\"><img src=\"bg_scroll.gif\" usemap=\"#link\" border=\"0\" width=\"269\" height=\"255\"></td>
</tr>
<tr>
    <td><img src=\"../../img/dot_trans.gif\" width=\"34\" height=\"1\"></td>
</tr>
<tr>
    <td></td>
    <td><img src=\"readme_no_viewme.gif\" alt=\"right-click and save\" title=\"right-click and save\" width=\"340\" height=\"377\" border=\"0\"></td>
</tr>
<tr>
    <td><img src=\"../../img/dot_trans.gif\" width=\"1\" height=\"30\"></td>
</tr>
</table>

<map name=\"link\">
<area alt=\"scroller graphics by {netfrenzy}\" title=\"scroller graphics by {netfrenzy}\" coords=\"174,224,217,230\" shape=\"rect\" href=\"http://www.netfrenzy.dk\" target=\"_blank\">
<area alt=\"please report bugs\" title=\"please report bugs\" coords=\"135,224,158,230\" shape=\"rect\" href=\"mailto:geeeet@ghtml.com\">
</map>

<!-- div containing up-arrow | change: top + left -->
<span id=\"up\" style=\"position: absolute; top: 23px; left: 223px; width: 1px; height: 1px; z-index: 1;\">
    <img src=\"up.gif\" border=\"0\">
</span>

<!-- div containing down-arrow | change: top + left -->
<span id=\"down\" style=\"position: absolute; top: 204px; left: 223px; width: 1px; height: 1px; z-index: 2;\">
    <img src=\"down.gif\" border=\"0\">
</span>

<!-- div containing scrollbar | change: top + left + width + height -->
<span id=\"drag\" style=\"position: absolute; top: 42px; left: 221px; width: 17px; height: 26px; z-index: 3;\">
    <img src=\"drag.gif\" border=\"0\">
</span>

<!-- div laying above scrollbar for netscape 6 protection | change: top + left + width + height -->
<span id=\"ruler\" style=\"position: absolute; top: 42px; left: 221px; width: 17px; height: 26px; z-index: 4;\"></span>

<!-- div containing content | change: top + left + width + height + clip -->
<span id=\"contentClip\" style=\"position: absolute; top: 46px; left: 43px; width: 176px; height: 172px; clip:rect(0px,176px,172px,0px); visibility: visible; z-index: 5; overflow: hidden;\">
    <span id=\"content\">
    <img src=\"scroll_txt.gif\">
    </span>
</span>

Hmm.. Mest billederne Kan Godt finde ud af at trykke på: Vis kilde!

billederne - du kan vel lave dem selv - eller?