Problem mit jQuery Swap-Script

...komplette Frage anzeigen

5 Antworten

Sers Jungs,

thx für euren Support! Ich bin ehrlich gesagt ein absoluter Noob was das programmieren mit jQuery angeht, habe zum Herausfinden dieser paar Zeilen schon Stunden gebraucht. Mein Schwerpunkt liegt im html + css ...

@denniskedo: wie genau würde denn die vereinfachte Version ausschauen, kannst du ein Beispiel bei http://jsfiddle.net posten?

@iFrageHier: jep, ich habe leider keine Ahnung, wie ich das geändert bekomme. Meine Idee war folgende:

  • Startzustand: Text1 + Bild1
  • Zustand 2: Text2 + Bild2

Ablauf: Klicke ich auf Text1 ändert sich das Bild1 auf Bild2 und der Text1 auf Text2. Klicke ich nun auf Text2 ändert sich das Bild2 wieder auf Bild1 und Text2 wieder auf Text1 (Startzustand). So besser nachvollziehbar?

Kannst Du mir hierfür eventl. eine Lösung bei jsfiddle.net posten?

Okay ich mach der mal morgen was fertig :) Heute hab ich keine Zeit mehr.

0
@iFrageHier

Hey, ich habe dein Script. Es ist sehr einfach gehalten, damit du es verstehst :) Bitte schau es dir gründlich an, kopier es nicht einfach!

<html>

<head>

<script src="http://code.jquery.com/jquery-1.9.1.js"></script>

</head>

<body>

<script type="text/javascript" language="javascript">
$(document).ready(function(){ //wenn die Seite lädt


$("#bild2").hide(); //Ganz zu Anfnag Bild 2 verstecken

$("#text2").hide(); //Ganz zu Anfnag Text 2 verstecken


$("#text1").click(function() { //wenn man klickt

$("#bild1, #text1").fadeOut(100); //Bild 1 und Text 1 ausblenden (0,1 Sekunde)

$("#bild2, #text2").delay(100).fadeIn(100); //Bild 2 und Text 2 einblenden (0,1 Sekunde)

});


$("#text2").click(function() { //wenn man klickt

$("#bild2, #text2").fadeOut(100); //Bild 2 und Text 2 ausblenden (0,1 Sekunde)

$("#bild1, #text1").delay(100).fadeIn(100); //Bild 1 und Text 1 einblenden (0,1 Sekunde)

});


});
</script>

<p id="text1">Zum zweiten Bild</p>

<img id="bild1"  src="" height="500" width="500">




<p id="text2">Zum ersten Bild</p>

<img id="bild2"  src="" height="500" width="500">

</body>

</html>
0

Überprüfe, welches Bild gerade angezeigt ist.

Wenn Bild 1 der Fall ist und der Button gedrückt wurde, setzt du Bild 1 auf .hide() und Bild 2 auf show(). Gleichzeitig änderst du dann je nachdem den Text mit .html("bla")

Dein Code ist auch etwas zu kompliziert, das geht einfacher

Da stimme ich dir zu, schau mal mein Beispiel an, was meinst du, einfach genug?

0

Da stimme ich dir zu, schau mal mein Beispiel an, was meinst du, einfach genug?

0

Umtose für viele Bilder zu verwenden ändere alles (außer die click Funktion) zu 'this' ohne die Anführungszeichen.

So wird nur das entsprechende Bild / Text angesprochen, welches angeklickt wurde.

Sry, aber das verstehe ich nicht ganz ... was soll ich mit 'this' abändern? Welchen Bereich im Script?

0

Ich habe mir die jQuery "this"-Funktion nochmal angeschaut, werde aus ihr jedoch leider nicht schlau, wo genau ich es in dem Script integrieren muss ... habe schon alles ausprobiert, wie z.B.:

Zeile vorher (aus dem Script):

  • $("#bild2").hide(); //Ganz zu Anfnag Bild 2 verstecken

Zeile mit "this" ??:

  • $this("#bild2").hide(); //Ganz zu Anfnag Bild 2 verstecken

Sry, stelle mich da wohl gerade etwas blöd an, doch jQuery ist für mich absolutes Neuland ;(.

0

Ich habe dir etwas gebastelt, steht hier auch schon als Kommentar, aber damit du es siehst (Kommentar != Antwort) nochmal als Antwort!

LINK: http://jsfiddle.net/gAQga/

Bitte schau es dir gründlich an, kopier es nicht einfach!

Sers iFrageHier,

dank Dir vielmals für Dein Script, genau soetwas habe ich gesucht!! Ich habe Dein Script genau studiert und teils angepasst, funktioniert alles super, ABER es gibt leider ein wichtiges Problem. Das Script kann, wenn ich nichts falsch mache, in der derzeitigen Variante leider nur 1mal pro Seite eingesetzt werden, right? Wie bekomme ich es hin, dass dieses Script auf der gleichen Seite mehrfach eingesetzt werden kann??

0

Weißt du nicht wie man den Text ändert? Dein Problem "es funktioniert nicht" ist sehr genau beschrieben.

$('.switchtext').text('bla bla') = Text ändern

Schreib mal zurück, ich weiß nicht genau wo dein Problem liegt / du eher Anfänger bist.

Thx für Deinen Support, ich weiß hier immer nicht wie ich am besten Antworte, damit Du das siehst? Habe jetzt mein Anliegen oben nochmal als Antwort gepostet, hilft Dir das weiter?

0

Was möchtest Du wissen?