Antworten auf deine Fragen:
Neues Thema erstellen

Text in einem div scrollen

AlphaGen

Nicht mehr ganz neu hier

Huhu Leute.

Hab hier ein Problem:
Ich habe Text, der länger ist als das div groß ist. Der Text wird durch overflow:hidden "abgeschnitten". Jetzt möchte ich über Pfeile, die ich rechts positionieren werde, gerne den Text scrollen. Leider habe ich keine Ahnung wie das funktionieren soll.

Ich habe schon im Forum gesucht und auch in Google. Habe auch eine scheinbar funktionierende Lösung gefunden.

Schöner scrollen mit MouseOver

Jedoch habe ich keine Ahnung wie ich das in meine Webseite einbinden kann.

Kann mir irgendjemand eine kurze Erklärung oder ein kurzes Script liefern, mit dem das möglich ist?

Danke im vorraus.

Edit: How to Scroll the Page With JavaScript

hab ich auch ausprobiert bzw leicht abgeändert.

Habe folgende funktionen in eine externe Datei geschrieben:

Code:
var scrolldelay;
function pageScroll() {
        window.scrollBy(0,50); // horizontal and vertical scroll increments
        scrolldelay = setTimeout('pageScroll()',100); // scrolls every 100 milliseconds
}



function stopScroll() {
        clearTimeout(scrolldelay);
}

Es steht nirgends dass scrolldelay eine globale Variable sein muss, aber anders ist das doch garnicht möglich. Oder?

Wenn ich das ganze jetzt in firefox starte (mit IE hab ichs noch nicht getestet) bekomme ich von Firebug die Nachricht:
"nicht wohlgeformt
[Break on this error] undefined"

Die Fehlermeldung soll angeblich in Zeile 22 verursacht werden. Aber hier steht nur "Martin & Stefan"
 

innoshea

Noch nicht viel geschrieben

AW: Text in einem div scrollen

hallo,

warum "overflow:hidden"?
es sollte heißen "overflow:scroll"
dadurch brauchst du keine extra pfeile positionieren. dem div wird dann automatisch, wenn dein text länger ist als die höhe des div´s, ein scrollbalken zugewiesen.

siehe auch hier:
overflow: Übergroßer Inhalt: CSS-Referenz auf CSS 4 You - The Finest in Stylesheets

du brauchst kein script dazu schreiben und es wird von allen browsern umgesetzt.

ich hoffe du kannst etwas damit anfangen und ich konnte dir helfen.

liebe grüße
daniela
 

FlashSoft

Besserwisser

AW: Text in einem div scrollen

In die CSS overflow:scroll, zeigt den Scrollbalken ständig, overflow:auto zeigt ihn nur, wenn der Inhalt zu groß für's DIV ist. Zeige mal doch deine HTML und CSS, vielleicht können wir dir da besser helfen.

FlashSoft
 

sokie

Mod | Web

AW: Text in einem div scrollen

'nicht wohlgeformt' klingt für mich nach ine Meldung, die eher aus dem Bereich xml. vielleicht passt dein (x)html code nicht zu deiner gewählten Doctype - aber das sollte die Ausführung von scripts nicht unbedingt beeinflussen. (fehlermeldungen javascripts betreffend findest du wenn in der Fehlerkonsole des FF).

wie der funktionsname pageScroll schon vermuten lässt geht es darum die Seite zu scrollen falls sie länger ist als die Browserfensterhöhe. Für einen Div ist eher die Lösung auf der DrWeb Seite Schöner scrollen mit MouseOver

und warum in einer externen Datei?
das Auslagern kann warten, bis das Ding sicher funktioniert.

hallo,

warum "overflow:hidden"?
weil es in der Lösung darum geht die Scrolleiste durch eine eigene zu ersetzen. dafür muss die Browsereigene unterdrückt werden.
 
Zuletzt bearbeitet:

AlphaGen

Nicht mehr ganz neu hier

AW: Text in einem div scrollen

Auslagern deshalb, weil ich sämtliche andere Funktionen auch schon ausgelagert hatte. Hab mir gedacht das wird ne schnelle Sache. Aber scheint nicht ganz so zu sein ;-)

Ich guck dann mal was ich hinbekomme. Schonmal vielen Dank.
 

cebito

undefined

AW: Text in einem div scrollen

Mit window.scrollby() scrollst du keinen div-container sondern das ganze Anzeigefenster. Hier mal 'ne Lösung die funktioniert:
Code:
var timer;
var i=0;
function scrollup(){
clearTimeout(timer);
d=document.getElementById('meinedivID')
y=d.scrollTop;
if(y<=d.scrollHeight-d.offsetHeight){
y--;
d.scrollTop=y;
timer=setTimeout('scrollup()',20);
}
else{
clearTimeout(timer);
}
}
function scrolldown(){
clearTimeout(timer);
d=document.getElementById('meinedivID')
y=d.scrollTop;
if(y<d.scrollHeight-d.offsetHeight){
y++;
d.scrollTop=y;
timer=setTimeout('scrolldown()',20);
}
else{
clearTimeout(timer);
}
}
function stopscroll(){
clearTimeout(timer);
}
Noch aufrufen...

Code:
<img src="up.jpg" onmouseover="javascript:scrollup();" onmouseout="javascript:stopscroll();"/>
<img src="down.jpg" onmouseover="javascript:scrolldown();" onmouseout="javascript:stopscroll();"/>
Mit den Werten kannst dann ein wenig rumspielen... Wichtig ist die ID von deinem div-container sonst weiß niemand was gescrollt werden soll.



Kleiner Tipp als Nachtrag: Wenn du in dein div noch ein div reinsteckst - 16px höher und 16px breiter und dem overflow:scroll gibst, können User die Javascript deaktiviert haben den div über das Mausrad scrollen und der Standart-Scrollbalken ist trotzdem nicht zu sehen..... In deiner Function musst dann natürlich die ID vom inliegenden div angeben...
 
Zuletzt bearbeitet:
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Neueste Themen & Antworten

Flatrate für Tutorials, Assets, Vorlagen

Zurzeit aktive Besucher

Statistik des Forums

Themen
118.642
Beiträge
1.538.514
Mitglieder
67.559
Neuestes Mitglied
Andi Schäfer
Oben