Antworten auf deine Fragen:
Neues Thema erstellen

Antworten zum Thema „JQuery - If/Else mit fadeOut/-In“

Winkili

Noch nicht viel geschrieben

Liebe PSD'ler,

momentan tüftle ich an einem Button, welcher einen DIV ein- und, falls dieser bereits eingeblendet ist, ausblendet. Und umgekehrt.
Gibt es eine Möglichkeit - womöglich sogar mittels if und else - dies zu realisieren?
Aktuell schaut mein Code wie folgt aus:
Code:
        <script type="text/javascript">    
            $(document).ready(function(){
            $("p.headline").click(function(){
            $("#ribbon").fadeOut();
            });
            });
        </script>
Vielen lieben Dank :)
Winkili
 

I

ingo95

Guest

AW: JQuery - If/Else mit fadeOut/-In

Du kannst eine Variable machen und die dann falls sie z.b. 1 ist wieder auf 0 machen und wenn sie auff 0 ist kannst du sie wieder auf 1 machen...
Und zusätzlich machst du dann noch immer wenn 0 ist fadeOut und wenn 1 ist fadeIn.
Natürlich alles nur wenner klickt.
 

Winkili

Noch nicht viel geschrieben

AW: JQuery - If/Else mit fadeOut/-In

Die Toggle-Funktion ist ja spitze, doch funktioniert diese auch mit Divs?
HTML:
<!DOCTYPE html>
<html>
<head>
  <script src="http://code.jquery.com/jquery-1.5.js"></script>
</head>
<body>
  
<div class="button" style="cursor: pointer">Button-Text</div>
<div class="text">This paragraph has a slow, linear fade.</div>
<div id="log"></div>

<script>
$(".button").click(function() {
  $(".text").fadeToggle("slow", "linear");
});
});
</script>

</body>
</html>
Mein ganz fix umgebastelter Code will noch nicht ganz ;)
 
Zuletzt bearbeitet:

Duddle

Posting-Frequenz: 14µHz

AW: JQuery - If/Else mit fadeOut/-In

Leg dir FireBug zu, falls du Firefox benutzt. Der zeigt dir in der Konsole sofort einen Syntax-Fehler auf Zeile 16: du hast ein "});" zuviel drin gelassen.


Duddle
 

cebito

undefined

AW: JQuery - If/Else mit fadeOut/-In

So ist es, der div ist auch nicht geschlossen. Stattdessen steht dort </p>
So funtionierts:

PHP:
<div class="button" style="cursor: pointer">Button-Text</div>
<div class="text">This paragraph has a slow, linear fade.</div>
<div id="log"></div>

<script>
$(".button").click(function() {
  $(".text").fadeToggle("slow", "linear");
});
</script>
 
Bilder bitte hier hochladen und danach über das Bild-Icon (Direktlink vorher kopieren) platzieren.
Antworten auf deine Fragen:
Neues Thema erstellen

Willkommen auf PSD-Tutorials.de

In unseren Foren vernetzt du dich mit anderen Personen, um dich rund um die Themen Fotografie, Grafik, Gestaltung, Bildbearbeitung und 3D auszutauschen. Außerdem schalten wir für dich regelmäßig kostenlose Inhalte frei. Liebe Grüße senden dir die PSD-Gründer Stefan und Matthias Petri aus Waren an der Müritz. Hier erfährst du mehr über uns.

Stefan und Matthias Petri von PSD-Tutorials.de

Nächster neuer Gratisinhalt

03
Stunden
:
:
25
Minuten
:
:
19
Sekunden

Flatrate für Tutorials, Assets, Vorlagen

Statistik des Forums

Themen
175.158
Beiträge
2.581.881
Mitglieder
67.226
Neuestes Mitglied
Alec168
Oben