✔ Mouse_over_stop in Autoscroller script

M

Magou

Grünschnabel
Guten Morgen Leute,

ich habe folgendes Anliegen.
Und zwar habe ich auf meiner Homepage soetwas wie eine kleine Infoleiste auf der rechten seite. Da nun der Platz nicht ausreicht, habe ich ein Javascript eingebaut, welches den Text in einem Bestimmten Feld scrollen lässt.
Leider beinhaltet das Script nicht, dass wenn ich mit der Maus auf den Text fahre, dieser anhält.
Ich poste mal das Script und den html code, und hoffe, dass man diesen erweitern kann. Solltet ihr bessere Scripts haben, die dieses gleich beinhalten, würde ich mich auch darüber freuen. Leider hat der Verfasser des Scripts welches ich benutze keine kontaktdaten auf seiner Homepage.

Vielen Dank im voraus.

Gruß

Code: 
/*
  The original source code is provided by Michael Maretzke.
  The code does not contain any copyright constraints.
  Please use and distribute it whenever and for whatever
  reasons you want to.
*/
// speed - the smaller the faster
var speed = 75;
// vertical - positive values == from top to bottom;
// vertical - negative values == from bottom to top
var vertical = -2;
// the size of the scroller
var size_y = 120;
var y = size_y;

function scroll() {
        if ((-y) > ((document.getElementById('ScrollerText').offsetHeight)))
                y = size_y;
        document.getElementById("ScrollerText").style.top = (y+=vertical);
        document.getElementById("ScrollerText").style.display = "block";
}

function initScroller() {
        setInterval("scroll()", speed);
}


html für das template:
Code: 
<div id="ScrollerContainer"
      style="border-width:thin;
             border-style:none;
             position:relative;
             width:162;
             height:162;
             overflow:hidden">
              <div id="ScrollerText"
                style="display:none;
                position:absolute;
                left:2px;
                top:0px;
                width:100%;">
                  <font size="-2" face="Verdana">

                    erste Info

                         <hr>

                         zweite info

                         <hr>
                         
                          dritte info

                         <hr>
                  </font>
              </div>
    </div>
 
Zuletzt bearbeitet:
Hallo,

danke für die Antwort. Das sieht schon gut aus was er da hat, aber da steige ich nicht durch.
Ich weiß nicht, was wo hinkommt und so. :-(
Wo meine News hinkämem sehe ich, und auch die variablen wüsste ich zu verändern. Nur weiß ich nicht, welchen Teil ich wo auf meine Seite packen müsste, ist der Ticker doch in 2 Teile unterteilt.
Hilfreich wäre für mich, wenn jemand das script welche sich gepostet habe evtl. so erweitern könnte, dass es mit mouse over funktioniert, denn das script welches ich z.Z. benitze wird wohl mit onload im body gleich zu anfang geladen.

Gruß

Edit:
 
Zuletzt bearbeitet:
Hi,

Svens Ticker kannst du in einer JS-Datei speichern, z.B. mit dem Namen ticker.js.

Diese Datei bindest du wie folgt an der Stelle im Dokument ein, an der der Ticker erscheinen soll:
Code: 
<script type="text/javascript" src="ticker.js"></script>

Du kannst dir das auch im Quellcode auf Svens Seite ansehen (Zeile 189).

Das Konfigurieren des Tickers sollte anhand der Kommentare im Quellcode selbsterklärend und mit ein wenig Eigeninitiative problemlos möglich sein.

Ciao
Quaese
 
Hallo,

ich glaube das Problem bei der sache ist, dass ich in diesem Script einen weiteren auslesen lassen wollt.
Um es kurz zu machen; ich habe eine 4 Images Galerie und ein phpbb Forum in einer Datenbank laufen, und beides so angepasst, dass es sauber läft als wäre es ein System. Jetzt lasse ich auf der Startseite (welche zur Galerei gehört) die letzten 3 Themen aus dem Forum auslesen. Das Script was ich z.Z. benutze läuft ja etrwas anders, so dass das möglich ist, da ich die "News" im normalen Quelltext eingebe. In Svens Script muss ich die "News" ja direkt in die js eingeben, was dann wieder mit dem auslesen der forenbeiträge durcheinander kommt. Und den dann so umzuschreiben, dass das funktioniert, dafür reichen meine Kenntnisse bei weitem nicht. Deswegen ist es mir eigentlich wichtig, den von mir genannten um die "stop" funktion zu erweitern.

Gruß
 
Hi,

dann änder die Funktion initScroller mal dahingehend ab, dass beim mouseover-Event das periodische Aufrufen der Scrollfunktion unterbunden und im mouseout-Event wieder gestartet wird.
Code: 
function initScroller() {
  document.getElementById("ScrollerContainer").onmouseover = function(){
    window.clearTimeout(hTimer);
  }
  document.getElementById("ScrollerContainer").onmouseout = function(){
    hTimer = setInterval("scroll()", speed);
  }
  hTimer = setInterval("scroll()", speed);
}

Ciao
Quaese
 
Um antworten zu können musst du eingeloggt sein.

Neue Beiträge

Zurück