Martin: Text scrollen

Hallo,

auf manchen Seiten (z.B. http://www.lena-live.de) wird ein Teilbereich der Seite mit Hilfe von Buttons gescrollt. Nun zu meiner Frage, wie geht sowas ? Mit JavaScript oder DHtml. Kann man in diese Teilbereiche auch Bilder einfügen.

Danke schon einmal

Martin

  1. Hallo,
    Scheint das selbe zu sein wie auf http://www.sane.at
    Ja, Grafiken kann man einbauen, weil ja ein normaler <div></div> Bereich gescrollt wird.

    Hallo,

    auf manchen Seiten (z.B. http://www.lena-live.de) wird ein Teilbereich der Seite mit Hilfe von Buttons gescrollt. Nun zu meiner Frage, wie geht sowas ? Mit JavaScript oder DHtml. Kann man in diese Teilbereiche auch Bilder einfügen.

    Danke schon einmal

    Martin

  2. Hallo.

    Ja, da gibt es mehrere Möglichkeiten so etwas zu machen.
    Hier mal eine, vielleicht hielft dir das ja schon weiter.

    <script language="JavaScript1.2">

    // Browser Kontrolle IE oder NN
    ie=document.all?1:0
    n=document.layers?1:0

    //Geschw. beim Scrollen
    Geschw=20

    //Höhe des Fensters
    HoeheFenster=100

    function ScrollContainererzeugen(Objekt,Formatierung){
     Formatierung=(!Formatierung) ? '':'document.'+Formatierung+'.'
     this.css=(n) ? eval(Formatierung+'document.'+Objekt):eval('document.all.'+Objekt+'.style')
     this.ScrollenHeight=n?this.css.document.height:eval('document.all.'+Objekt+'.offsetHeight')
     this.top=Spitzeermitteln
     return this
    }

    function Spitzeermitteln(){
     var Spitzelinks=(n) ? eval(this.css.top):eval(this.css.pixelTop);
     return Spitzelinks;
    }

    var ScrollenTim;
    var aktPunkt=0;

    function Scrollen(Geschw_Scrollen){
     clearTimeout(ScrollenTim)
     Scroll_Richtung=Geschw_Scrollen>0?1:0
     if((!Scroll_Richtung && Scroll_Container[aktPunkt].top()>-Scroll_Container[aktPunkt].ScrollenHeight+HoeheFenster) || (Scroll_Container[aktPunkt].top()<0 && Scroll_Richtung)){
      Scroll_Container[aktPunkt].css.top=Scroll_Container[aktPunkt].top()+Geschw_Scrollen
      ScrollenTim=setTimeout("Scrollen("+Geschw_Scrollen+")",Geschw)
     }
    }

    function Scrollen_aus(){
     clearTimeout(ScrollenTim)
    }

    function aktPunkt_Aendern(num){
     Scroll_Container[aktPunkt].css.visibility='hidden'
      aktPunkt=num
     Scroll_Container[aktPunkt].css.top=0
     Scroll_Container[aktPunkt].css.visibility='visible'
    }

    function initialisierung(){
     Scroll_Container=new Array()
     Scroll_Container[0]=new ScrollContainererzeugen('ScrollAbschn1','FormatContainer2')
     Scroll_Container[0].css.visibility='visible'
    }
    onload=initialisierung;
    //-->
    </script>

    <style>
     #FormatContainer{position:absolute; width:50; font-family:arial; left:30; top:20; font-size:10pt; }
     #FormatContainer2{position:absolute; top:20; left:100; clip:rect(0,250,120,0); height:150; width:250}
     .ScrollClass{position:absolute; top:0; font-size:10pt; left:0; font-family:arial; visibility:hidden}
    </style>
    </head>

    <body>
    <div  align ="center" id="FormatContainer">
        <p align="center">
        <hr>
     <a href="#" onmouseover="Scrollen(5)" onmouseout="Scrollen_aus()"><font color="#FF0000">nachoben</a>
     <a href="#" onmouseover="Scrollen(-1)" onmouseout="Scrollen_aus()"><b>nachunten</b></a>
    </div>
    <div align ="left" id="FormatContainer2">
     <div id="ScrollAbschn1" class="ScrollClass">
     <font face Arial color=000000 size=2>
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      Hier ist der Text der scrollen soll.
      </font>
     </div>

    </div>
    </body>
    </html>

    Was du in den Layer hineinlegst ist eigenlich egal.
    Na dann noch viel Spaß beim basteln.

    Bis dann holger_b.

    1. Danke Holger,

      das ist genau das, was ich wollte