Automatisch langesam scrollen nach 3 Sekunden - dann Sekunden Pause und oben wieder

[Kasalop]

Dein Code ist nicht empfohlener Pluginstil! Dann könnte er auch eine css klasse zur identifizieurng nutzen.

Lg Kasalop

[nooneatall]

Ich muss gestehen, dass ich das nicht verstehe. Die html speist sich aus einer css. Wenn ich die entsprechend einstellen kann, wäre das prima. Aber wie denn?

[Sempervivum]

Ich verstehe nicht genau, was Du meinst, aber ich würde das Scrollen unterbinden, wenn das Dokument kleiner als die Fensterhöhe ist:

if (docheight  > $(window).height()) doScroll($(this));

[nooneatall]

Ok, danke. Das hilft für den fall, dass wenig Vertretung anliegt. Wenn viel anliegt, dann scrollt sich zur zeit der plan nen Wolf. Entweder dauert es zu lange, oder man kann nichts mehr richtig lesen. Daher die frage, wie man nicht Pixel für Pixel nach unten scrollt, sondern zum Beispiel große Sprünge von 400px macht mit einer Pause von 5 Sekunden vor dem nächsten Sprung!

[Sempervivum]

Ist natürlich auch machbar, aber dann muss man das Ganze neu aufbauen. Ich sehe es mir morgen mal an.

[nooneatall]

Vielen Dank mal wieder...

[Sempervivum]

Hast Du es dir so vorgestellt?:

    jQuery.fn.scroller = function() {
          var scrollamount = $(this).height() - $(window).height();
          var pauseduration = 3000;
          var pausescroll = 5000;
          var stepsize = 400;
          var factorduration = 10;
          var docheight = $(this).height();
          var position = 0;
          function scrollDown (obj) {
              if (position == 0) currentdelay = pauseduration; else currentdelay = pausescroll;
              if (position + stepsize  < scrollamount) {
                  position += stepsize;
                  duration = stepsize * factorduration;
                  obj.delay(currentdelay).animate({top: - position}, duration, function (){
                      scrollDown(obj);
                      })
                  } else {
                  duration = (scrollamount - position) * factorduration;
                  position = scrollamount;
                  obj.delay(currentdelay).animate({top: -position}, duration, function (){
                      scrollUp(obj);
                      });
                  }
              };
          function scrollUp (obj) {
              if (position == scrollamount) currentdelay = pauseduration; else currentdelay = pausescroll;
              if (position - stepsize  > 0) {
                  position -= stepsize;
                  duration = stepsize * factorduration;
                  obj.delay(currentdelay).animate({top: - position}, duration, function (){
                      scrollUp(obj);
                      })
                  } else {
                  duration = position * factorduration;
                  position = 0;
                  obj.delay(currentdelay).animate({top: -position}, duration, function () {
                      scrollDown(obj);
                      });
                  }
              };
          if (docheight  > $(window).height()) scrollDown($(this));
//          $(this).height($(window).height());
          };
    $(document).ready(function(){
        $('#globdiv').scroller();
        $('#globdiv2').scroller();
        });

[Sempervivum]

Ich habe jetzt auch noch die Höhe animiert, damit die Scrollbar ruhig bleibt:

    jQuery.fn.scroller = function() {
          var scrollamount = $(this).height() - $(window).height();
          var pauseduration = 3000;
          var pausescroll = 5000;
          var stepsize = 400;
          var factorduration = 5;
          var docheight = $(this).height();
          var position = 0;
          function scrollDown (obj) {
              if (position == 0) currentdelay = pauseduration; else currentdelay = pausescroll;
              if (position + stepsize  < scrollamount) {
                  position += stepsize;
                  duration = stepsize * factorduration;
                  obj.delay(currentdelay).animate({top: - position, height: position + $(window).height()},
                                                  duration, function (){scrollDown(obj);});
                  } else {
                  duration = (scrollamount - position) * factorduration;
                  position = scrollamount;
                  obj.delay(currentdelay).animate({top: -position, height: position + $(window).height()},
                                                   duration, function (){scrollUp(obj);});
                  }
              };
          function scrollUp (obj) {
              if (position == scrollamount) currentdelay = pauseduration; else currentdelay = pausescroll;
              if (position - stepsize  > 0) {
                  position -= stepsize;
                  duration = stepsize * factorduration;
                  obj.delay(currentdelay).animate({top: - position, height: position + $(window).height()},
                                                  duration, function (){scrollUp(obj);});
                  } else {
                  duration = position * factorduration;
                  position = 0;
                  obj.delay(currentdelay).animate({top: -position, height: position + $(window).height()},
                                                  duration, function () {scrollDown(obj);});
                  }
              };
          if (docheight  > $(window).height()) {
              $(this).height($(window).height());
              scrollDown($(this));
              };
          };
    $(document).ready(function(){
        $('#globdiv').scroller();
        $('#globdiv2').scroller();
        });

[Kasalop]

Man könnte sogar auch Interfaces machen, aber das ist eigentlich sinnfrei, da diese ja nur Hilfskrücken für fehlende multiple Vererbung sind und man in JS wunderbar MixIns machen kann.

Das stimmt so nicht. Interfaces sind nicht nur für mehrfachvererbung da. In anderen Sprachen kann man die deutlich besser nutzen.

@semper: wenns doch schon immer ein plugin sein muss... schreib doch mal vernünftigen plugincode oder pack es in eine normale funktion. momentan hast du keinen mehrwert dadurch und so schwer isses ja wohl auch nicht :roll:

Lg Kasalop

[kkapsner]

Reine OT Beiträge wurden in einen extra Thread verschoben (http://forum.jswelt.de/javascript/57...rfaces-js.html (Diskussion zu Klassen/Interfaces in JS)), um das Ganze hier etwas übersichtlicher zu halten - nur sind deswegen einige Beiträge ohne Zusammenhang

[sebstruck]

Hallo.
Der Topic ist zwar schon ewig alt, aber wir versuchen gerade genau das zu realisieren, was hier beschrieben wird. Da ich von den ganzen Codes keine Ahnung habe, wollte ich fragen, welche Lösung gefunden wurde und ob Sie das Ergebnis teilen würden.

Unser Vorhaben:
Täglicher Export (html) des Vertretungsplans soll bei Überschreitung des Bildschirms automatisch gescrollt werden. Wenn die Seite unten angekommen ist, soll sie wieder nach oben springen und von vorne beginnen. Da der Export täglich aktualisiert wird, wäre ein Verweis auf eine externe Datei super.

Vielen Dank für die Hilfe und viele Grüße

[kkapsner]

Von den Hauptbeteiligten habe ich schon lange keinen mehr hier gesehen. Deswegen wird wahrscheinlich die Lösung hier nicht erscheinen... aber dein Vorhaben ist auch etwas anders, da du nicht 3 Skunden warten willst.
Deswegen kann die "Lösung" auch viel einfacher aussehen:

<!DOCTYPE html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
<style type="text/css">
body {
	height: 3000px;
	border: 100px dashed red;
}
</style>
</head>
<body>
inhalt
<script type="text/javascript">
(function(){
	var step = 4;
	function scroll(){
		var position = window.pageYOffset;
		window.scrollBy(0, step);
		if (position === window.pageYOffset){
			step *= -1;
		}
		window.setTimeout(scroll, 10);
	}
	scroll();
}());
</script>
</body>
</html>

- das ist aber wahrscheinlich erst der Anfang. Für genauere Informationen müssen wir aber deine Anforderungen besser kennen.

Da der Export täglich aktualisiert wird, wäre ein Verweis auf eine externe Datei super.

JS würde ich immer in einer externen Datei speichern. Ist aber vom Vorgehen ziemlich egal, ob man den JS-Code direkt in das HTML oder eine externe Datei schreibt. Hat auf den JS-Code nur minimalen Einfluss (meistens gar keinen).

[sebstruck]

Von den Hauptbeteiligten habe ich schon lange keinen mehr hier gesehen. Deswegen wird wahrscheinlich die Lösung hier nicht erscheinen... aber dein Vorhaben ist auch etwas anders, da du nicht 3 Skunden warten willst.

das ist aber wahrscheinlich erst der Anfang. Für genauere Informationen müssen wir aber deine Anforderungen besser kennen.

Doch, letztendlich wären 3 Sekunden und dann wieder nach oben springen nicht schlecht und beruhigt das Auge. Ich glaube, wir wollen das gleiche Anzeigeverfahren.

JS würde ich immer in einer externen Datei speichern. Ist aber vom Vorgehen ziemlich egal, ob man den JS-Code direkt in das HTML oder eine externe Datei schreibt. Hat auf den JS-Code nur minimalen Einfluss (meistens gar keinen).

Und wo schreibe ich den Pfad zu meiner exportierten html hinein?

Vielen Dank schonmal für die super Hilfe. Hatte schon Sorge, dass der Thread eingeschlafen ist.

[kkapsner]

Wenn irgendwo mal 3 Sekunden gewartet werden soll, ist das auch kein Hexenwerk. Man kann ja den initialen Aufruf von scroll auch in ein window.setTimeout() packen. Und beim Richtungswechsel (ich finde das Springen zu unruhig) kann man auch einen verzögerten Aufruf reinpacken:

<!DOCTYPE html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
<style type="text/css">
body {
	height: 3000px;
	border: 100px dashed red;
}
</style>
</head>
<body>
inhalt
<script type="text/javascript">
(function(){
	var step = 4;
	function scroll(){
		var position = window.pageYOffset;
		window.scrollBy(0, step);
		if (position === window.pageYOffset){
			step *= -1;
			window.setTimeout(scroll, 3000);
		}
		else {
			window.setTimeout(scroll, 10);
		}
	}
	window.setTimeout(scroll, 3000);
}());
</script>
</body>
</html>

Und wo schreibe ich den Pfad zu meiner exportierten html hinein?

Das geht anders herum: in der HTML-Datei verlinkst du auf die JS-Datei.

[sebstruck]

Wenn irgendwo mal 3 Sekunden gewartet werden soll, ist das auch kein Hexenwerk. Man kann ja den initialen Aufruf von scroll auch in ein window.setTimeout() packen. Und beim Richtungswechsel (ich finde das Springen zu unruhig) kann man auch einen verzögerten Aufruf reinpacken:

<!DOCTYPE html>

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>Fenstertitel</title>
<style type="text/css">
body {
	height: 3000px;
	border: 100px dashed red;
}
</style>
</head>
<body>
inhalt
<script type="text/javascript">
(function(){
	var step = 4;
	function scroll(){
		var position = window.pageYOffset;
		window.scrollBy(0, step);
		if (position === window.pageYOffset){
			step *= -1;
			window.setTimeout(scroll, 3000);
		}
		else {
			window.setTimeout(scroll, 10);
		}
	}
	window.setTimeout(scroll, 3000);
}());
</script>
</body>
</html>

Das geht anders herum: in der HTML-Datei verlinkst du auf die JS-Datei.

Ok. Haben Sie eine Idee, wie ich das automatisch in den Untis-Export hineinbekomme? Oder muss ich in jede exportierte html reingehen und das einfügen?

Vielen Dank für die Hilfe