Probleme in Schleife
kariert
- javascript
Hallo,
ich habe folgendes Problem:
es gibt 3 div-boxen welche ähnlich wie bei Apfelprodukten durch seitlich-fahrende Animation aufgerufen werden sollen.
Generell funktioniert mein Vorhaben, wenn ich mich auf der Startseite befinde.
Bin ich aber auf Seite 2, übernimmt er die JQuery Eigenschaften des Verschiebens -> Dieses versuchte ich durch eine ITE-Auswahl zu umgehen.
Leider ohne Vergnügen - jetzt blockt es das ganze komplett.
Habt ihr einen Vorschlag für eine Lösung oder findet den Fehler?
Danke
<!DOCTYPE html>
<html>
<head>
<style>
body, html { overflow: hidden; }
#navi {
position:relative;
background-color:#abc;
margin: 10px auto auto auto;
width:110px;
height:30px;
}
#div1 {
position:relative;
background-color:#abc;
margin: 50px auto auto auto;
width:500px;
height:800px;
}
#div2 {
position:absolute;
background-color:#abc;
width:500px;
height:800px;
margin: -800px 0 0 2000px;
}
#div3 {
position:absolute;
background-color:#abc;
width:500px;
height:800px;
margin: -800px 0 0 3290px;
}
</style>
<script src="http://code.jquery.com/jquery-
latest.js"></script>
</head>
<body>
<div id="navi">
<button id="b1">b1</button>
<button id="b2">b2</button>
<button id="b3">b3</button>
</div>
<div id="div1" class="block"></div>
<div id="div3" class="block"></div>
<div id="div2" class="block"></div>
<script>
var page=1;
if (page=1)
{
$("#b1").click(function(){
$(".block").animate({"left": "+=0px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "-=1290px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=2580px"}, "slow");
page=3;
});
}
else (if (page=2))
{
if (page=2) {
$("#b1").click(function(){
$(".block").animate({"left": "+=1290px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "-=0px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=1290px"}, "slow");
page=3;
});
}
else (if (page=3))
{
$("#b1").click(function(){
$(".block").animate({"left": "+=2580px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "+=1290px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=0px"}, "slow");
page=3;
});
}
</script>
</body>
</html>
Hallo kariert,
if (page=1)
else (if (page=2))
ein Klassiker :)
page = 1 ist eine Zuweisung, page == 1 ist ein Vergleich.
Gruß, Jürgen
Hallo kariert,
if (page=1)
else (if (page=2))
ein Klassiker :)
page = 1 ist eine Zuweisung, page == 1 ist ein Vergleich.
Gruß, Jürgen
Oh peinlich. Aber leider nicht die Lösung des Problems. Funktioniert dennoch nicht...
Hallo kariert,
passt du diese Zeile auf den einzelnen Seiten an?
var page=1;
Gruß, Jürgen
Hallo kariert,
passt du diese Zeile auf den einzelnen Seiten an?
var page=1;
Gruß, Jürgen
Was du mit "anpassen" meinst weiß ich gerade nicht...
ich dachte mir nur, ich gebe den Startwert 1 vor,da ich ja mit der Startseite beginne.
drückt man nun oben den Button zur Seite 2, würde page=2 gesetzt werden....folgend wird der erste Else-zweig genutzt damit die Verschiebung jetzt auf die 2. und mittlere Seite angewendet werden kann.
das ist doch vom Grundgedanken her richtig oder?
Ich finde nur meinen Fehler nicht, warum er scheinbar gar nicht in den if-then-else-zweig steigt.
Danke @ Jürgen
Hallo Kariert,
drückt man nun oben den Button zur Seite 2, würde page=2 gesetzt werden....
würde oder wird? Steht da var page=2; ? Und wenn ja, du also das Script auf jeder Seite anpassen musst, warum lässt du dann das if ... else if ... nicht einfach weg und schreibst nur das, was da wirklich hin soll. Oder wird das Script in eine exteren JS-Datei ausgelagert und auf der jeweiligen Seite steht nur var page = xxx?
Gruß, Jürgen
Hallo Kariert,
drückt man nun oben den Button zur Seite 2, würde page=2 gesetzt werden....
würde oder wird? Steht da var page=2; ? Und wenn ja, du also das Script auf jeder Seite anpassen musst, warum lässt du dann das if ... else if ... nicht einfach weg und schreibst nur das, was da wirklich hin soll. Oder wird das Script in eine exteren JS-Datei ausgelagert und auf der jeweiligen Seite steht nur var page = xxx?
Gruß, Jürgen
Naja laut meinem Quelltext, wird es gesetzt...aber beim wiederholten klicken auf die Buttons scheint "page" ungleich meiner gesetzten Festlegung zu sein.
auf wenn ich die Anweisung gebe
if (page==1) {
...}
if (page==2) {
...}
if (page==3) {
...}
funktioniert es nicht.
-->
<!DOCTYPE html>
<html>
<head>
<style>
body, html { overflow: hidden; }
#navi {
position:relative;
background-color:#abc;
margin: 10px auto auto auto;
width:110px;
height:30px;
}
#div1 {
position:relative;
background-color:#abc;
margin: 50px auto auto auto;
width:500px;
height:800px;
}
#div2 {
position:absolute;
background-color:#abc;
width:500px;
height:800px;
margin: -800px 0 0 2000px;
}
#div3 {
position:absolute;
background-color:#abc;
width:500px;
height:800px;
margin: -800px 0 0 3290px;
}
</style>
<script src="http://code.jquery.com/jquery-
latest.js"></script>
</head>
<body>
<div id="navi">
<button id="b1">b1</button>
<button id="b2">b2</button>
<button id="b3">b3</button>
</div>
<div id="div1" class="block"></div>
<div id="div3" class="block"></div>
<div id="div2" class="block"></div>
<script>
var page=1;
if (page==1)
{
$("#b1").click(function(){
$(".block").animate({"left": "+=0px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "-=1290px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=2580px"}, "slow");
page=3;
});
}
if (page==2)
{
if (page=2) {
$("#b1").click(function(){
$(".block").animate({"left": "+=1290px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "-=0px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=1290px"}, "slow");
page=3;
});
}
if (page==3)
{
$("#b1").click(function(){
$(".block").animate({"left": "+=2580px"}, "slow");
page=1;});
$("#b2").click(function(){
$(".block").animate({"left": "+=1290px"}, "slow");
page=2;
});
$("#b3").click(function(){
$(".block").animate({"left": "-=0px"}, "slow");
page=3;
});
}
</script>
</body>
</html>
Hi,
Naja laut meinem Quelltext, wird es gesetzt...aber beim wiederholten klicken auf die Buttons scheint "page" ungleich meiner gesetzten Festlegung zu sein.
auf wenn ich die Anweisung gebeif (page==1) {
...}
if (page==2) {
...}
if (page==3) {
...}funktioniert es nicht.
Wie ich schon schrieb: dieser Code wird genau einmal durchlaufen.
Wie kommst Du darauf, daß dieser Code nochmal durchlaufen würde nach einem Klick?
cu,
Andreas
Hallo kariert,
erstens hat dein Code noch einen Fehler:
nach dem if (page==2) muss das if (page=2) { weg. Du solltest mal einen Blick in die Javascript-/Fehlerkonsole werfen.
Dein Code wird genau einmal nach dem Laden der Seite ausgeführt. Da du am Anfang page auf 1 setzt, wird auch nur der erste Zweig der if-else-if-Struktur abgearbeitet. Auch das setzen von page auf andere Werte hat keinen Einfluss, da am Ende der if-Struktur schluss ist. Eine Schleife, die das mehrmals abarbeitet, sehe ich nicht.
Gruß, Jürgen
Hi,
nach dem if (page==2) muss das if (page=2) { weg. Du solltest mal einen Blick in die Javascript-/Fehlerkonsole werfen.
Dein Code wird genau einmal nach dem Laden der Seite ausgeführt. Da du am Anfang page auf 1 setzt, wird auch nur der erste Zweig der if-else-if-Struktur abgearbeitet. Auch das setzen von page auf andere Werte hat keinen Einfluss, da am Ende der if-Struktur schluss ist. Eine Schleife, die das mehrmals abarbeitet, sehe ich nicht.
Das schrieb ich um 7:06 schon.
cu,
Andreas
Hallo MudGuard,
es wird so viel wiederholt ...
Hoffentlich ist es angekommen.
Gruß, Jürgen
Hi,
Hallo,
ich habe folgendes Problem:
es gibt 3 div-boxen welche ähnlich wie bei Apfelprodukten durch seitlich-fahrende Animation aufgerufen werden sollen.Generell funktioniert mein Vorhaben, wenn ich mich auf der Startseite befinde.
Bin ich aber auf Seite 2, übernimmt er die JQuery Eigenschaften des Verschiebens -> Dieses versuchte ich durch eine ITE-Auswahl zu umgehen.
Leider ohne Vergnügen - jetzt blockt es das ganze komplett.
Habt ihr einen Vorschlag für eine Lösung oder findet den Fehler?<script>
var page=1;
if (page=1)
{
$("#b1").click(function(){
$(".block").animate({"left": "+=0px"}, "slow");
page=1;});$("#b2").click(function(){
$(".block").animate({"left": "-=1290px"}, "slow");
page=2;
});$("#b3").click(function(){
$(".block").animate({"left": "-=2580px"}, "slow");
page=3;
});
}else (if (page=2))
Das mit == wurde ja schon erwähnt.
Aber der Code ab hier ist irrelevant.
Der Code wird genau einmal durchlaufen (ist ja keine Schleife, und auch keine Funktion, die mehrfach aufgerufen wird).
page wird am Anfang auf 1 gesetzt, und beim einzigen Durchlauf wird also die Bedingung des ersten if zutreffen.
Frage: warum die Klammern um das if (page == 2)?
Das würd ich erstmal als Syntaxfehler ansehen (aber vielleicht ist der JS-Interpreter da gnädiger - hab jetzt keine Lust, das zu überprüfen) ...
{
if (page=2) {
Und warum fragst Du hier, innerhalb des Blocks, der nur angesprungen würde, wenn page == 2 wäre, was es aber dank des anfänglichen page = 1 nie sein wird, nochmal ab, ob page == 2 ist - bevor irgendeine Änderung an page stattfinden kann?
cu,
Andreas
Leider ohne Vergnügen - jetzt blockt es das ganze komplett.
wenn du Probleme in der Schleife hast, solltest du uns die Schleife auch zeigen...
Gruß
Kalk