andei: Problem mit mehreren ScrollBy-Funktionen

Beitrag lesen

SELF-Forum

Problem mit mehreren ScrollBy-Funktionen

andei
– Informationen zu den Bewertungsregeln

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">&nbsp;</td>
  </tr>
</table>

</body>
</html>

Dankeschön
andei

Beitrag melden
–
Informationen zu den Bewertungsregeln