nicht angemeldet
Problem mit mehreren ScrollBy-Funktionen
Guten Tag,
ich möchte eine Navigation erstellen, die es ermöglicht zwischen verschiedenen Inhalten zu wechseln, ohne eine neue Seite zu öffnen.
Ich habe verschiedene Möglichkeiten mit scrollby ausprobiert. Die Folgende funktioniert auch mit Safari und Firefox (Mac).
Das Problem ist, dass der Wechsel zwischen den Anzeigebereichen nur 1-2mal funktioniert. Gibt es dafür eine Lösung bzw. eine andere Möglichkeit um das umzusetzen?
<html>
<head>
<title>ScrollNavigation</title>
</head>
<script language="JavaScript">
var countDown = 100;
function OneTwo() {
window.scrollBy(15,0);
countDown = countDown - 1;
Scrollen1();
}
function Scrollen1() {
if (countDown !=0){
window.setTimeout("OneTwo()",0);
}
}
var countDown = 100;
function OneThree() {
window.scrollBy(0,10);
countDown = countDown - 1;
Scrollen2();
}
function Scrollen2() {
if (countDown !=0){
window.setTimeout("OneThree()",0);
}
}
var countDown = 100;
function TwoOne() {
window.scrollBy(-15,0);
countDown = countDown - 1;
Scrollen3();
}
function Scrollen3() {
if (countDown !=0){
window.setTimeout("TwoOne()",0);
}
}
var countDown = 100;
function TwoThree() {
window.scrollBy(-15,10);
countDown = countDown - 1;
Scrollen4();
}
function Scrollen4() {
if (countDown !=0){
window.setTimeout("TwoThree()",0);
}
}
var countDown = 100;
function ThreeOne() {
window.scrollBy(0,-10);
countDown = countDown - 1;
Scrollen5();
}
function Scrollen5() {
if (countDown !=0){
window.setTimeout("ThreeOne()",0);
}
}
var countDown = 100;
function ThreeTwo() {
window.scrollBy(-15,-10);
countDown = countDown - 1;
Scrollen6();
}
function Scrollen6() {
if (countDown !=0){
window.setTimeout("ThreeTwo()",0);
}
}
</script>
<body>
<table width="3000" height="2000" border="0">
<tr>
<td width="800" height="400" align="left" valign="top"><p>Seite 1</p>
<p><a href="javascript:OneTwo()">2</a> <a href="javascript:OneThree()">3 </a></p></td>
<td width="800" height="400" align="left" valign="top"><p>Seite 2</p>
<p><a href="javascript:TwoOne()">1</a> <a href="javascript:TwoThree()">3</a> </p></td>
</tr>
<tr>
<td width="800" height="400" align="left" valign="top"><p>Seite 3</p>
<p><a href="javascript:ThreeOne()">1</a> <a href="javascript:ThreeTwo()">2 </a></p></td>
<td width="800" height="400"> </td>
</tr>
</table>
</body>
</html>
Dankeschön
andei
-
du benutzt die Variable countDown mehrfach, natürlich kommen sich die verschiedenen Funktionen dabei in die Quere.
Wenn du schon einfach eine Funktion mehrfach kopierst und umbenennst musst du auch darauf achten die zugehörigen (globalen) Variablen mit umzubenennen (oder nur lokale nutzen).Wozu überhaupt der Aufruf
window.setTimeout("OneTwo()",0);
mit setTimeout?
Wenn das sofort passieren soll (0) reicht
OneTwo();
stattdessen.-
Danke für deine Antwort! Ich bin leider nicht sehr erfahren mit Javascript.
Wenn du schon einfach eine Funktion mehrfach kopierst und umbenennst musst du auch darauf achten die zugehörigen (globalen) Variablen mit umzubenennen (oder nur lokale nutzen).
Wie kann ich denn die Variablen (countDown) unterscheiden?
-
Hi,
Wenn du schon einfach eine Funktion mehrfach kopierst und umbenennst musst du auch darauf achten die zugehörigen (globalen) Variablen mit umzubenennen (oder nur lokale nutzen).
Wie kann ich denn die Variablen (countDown) unterscheiden?
In dem du den gleichen genialen Trick anwendest, den vermutlich auch deine Eltern angewandt haben, sofern du kein Einzelkind bist: Sie haben nicht dich und alle deine Geschwister "andei" genannt, sondern euch *verschiedene* Namen gegeben, um euch gezielt ansprechen zu koennen ...
MfG ChrisB
-
Genau, das ist bei diesem Forum ja nicht möglich. Sonst wär mein Benutzername ANDI! :-)
Aber wie kann ich hier verschiedene Namen für die Variable countDown geben eingeben:
var countDown = 100;
function OneTwo() {
window.scrollBy(15,0);
countDown = countDown - 1;
Scrollen1();
}Egal was ich versuche, es funktioniert danach gar nix mehr...
-
-
-