Benutzer:J*/Spielwüste: Unterschied zwischen den Versionen

Aktuelle Version vom 21. Juli 2011, 15:47 Uhr

JQuery Klappdings[bearbeiten]

Visible. TRIG

Inline Test[bearbeiten]

Lorem Visible. TRIG Hidden. TRIG ipsum.

jQuery(".jq_tr").click( function () {
    var $this = jQuery(this);
    var speed = "fast";
    if ($this.parents(".jq_k").hasClass("fade_slow"))
        speed = "slow";
    else if ($this.parents(".jq_k").hasClass("fade_immediate"))
        speed = 0;
    $this.parents(".jq_k").children(".jq_kd").show(speed);
    $this.parents(".jq_kd").hide(speed);
});

Akkordeon[bearbeiten]

Head 1

Body 1

Head 2

Head 3

Inline Test[bearbeiten]

Test | Head 1 Body 1 | Head 2 Body 2 | Bla

jQuery('.jq_z .jq_h').click(function() {
    var $this = jQuery(this);
    var speed = "fast";
    if ($this.parents(".jq_z").hasClass("fade_slow"))
        speed = "slow";
    else if ($this.parents(".jq_z").hasClass("fade_immediate"))
        speed = 0;
    var $this = jQuery(this);
    $this.parents(".jq_z").children(".jq_a").hide(speed);
    $this.next(".jq_a").show(speed);
});

@@ Zeile 1: / Zeile 1: @@
-An dieser Stelle wird eine Hochlade-Seite simuliert! Wie könnte ein Javascript-Klick-Tag-System aussehen?
+==JQuery Klappdings==
-<div style="border: 1px blue dotted; margin-top: 5px; padding: 5px; background-color: #ffffdd;" >
+<div class="jq_k fade_slow" style="border: 1px yellow solid;">
-{| cellspacing="0" cellpadding="0" style="background:none;"
-|-
+<div class="jq_kd" style="border: 1px blue solid;">
-|valign="middle" align="center"|Wiki&nbsp;sagt:&nbsp;<br/>[[Bild:Wiki doof.png|80px]]
+Visible. <span class="jq_tr" style="border: 1px red solid;">TRIG</span>
-|valign="bottom"|<div style="margin-right:15px;">http://kamelopedia.mormo.org/images/7/74/Anf%C3%BChrungszeichen1.png</div>
+</div>
-|valign="top"|Auch beim Hochladen von Dateien muss alles seine [[Projekt:Bürokratenspiel|Ordnung]] haben. Du solltest daher unbedingt angeben
-* Welche Quellen du benutzt hast (auch wenn du gar keine benutzt hast)
+<div class="jq_kd" style="display:none; border: 1px green solid;">
-* unter welcher Lizenz du das Bild der Kamelopedia zur verfügung stellst
+Hidden. <span class="jq_tr" style="border: 1px red solid;">TRIG</span>
-Damit man dein Bild besser findet, kannst du zudem angeben:
+</div>
-* was für ein Bildtechnik benutzt wurde
-* mit welcher Malware du das Bild erstellt hast
+</div>
-* Stichworte, was auf dem Bild zu sehen ist.
-Wenn du möchtest, helfe ich dir gern beim Eingeben. Benutz einfach meine Klickboxen da unten und setze dir die vorlagen in den Beschreibungstext.
+===Inline Test===
-|valign="top"|<div style="margin-left:15px;">http://kamelopedia.mormo.org/images/3/37/Anf%C3%BChrungszeichen2.png</div>
-|}
+Lorem <span class="jq_k fade_immediate" style="border: 1px yellow solid;">
-<div id="klicktag">
+<span class="jq_kd" style="border: 1px blue solid;">
-Leider kann Wiki dir nicht helfen, wenn du dein Javascript ausgeschaltet hast. Also mach's entweder selber oder schalt dein Javascript ein!
+Visible. <span class="jq_tr" style="border: 1px red solid;">TRIG</span>
+</span>
+<span class="jq_kd" style="display:none; border: 1px green solid;">
+Hidden. <span class="jq_tr" style="border: 1px red solid;">TRIG</span>
+</span>
+</span> ipsum.
+<pre>
+jQuery(".jq_tr").click( function () {
+    var $this = jQuery(this);
+    var speed = "fast";
+    if ($this.parents(".jq_k").hasClass("fade_slow"))
+        speed = "slow";
+    else if ($this.parents(".jq_k").hasClass("fade_immediate"))
+        speed = 0;
+    $this.parents(".jq_k").children(".jq_kd").show(speed);
+    $this.parents(".jq_kd").hide(speed);
+});
+</pre>
+==Akkordeon==
+<div class="jq_z">
+<div class="jq_h">
+'''Head 1'''
+</div>
+<div class="jq_a">
+Body 1
+</div>
+<div class="jq_h">
+'''Head 2'''
+</div>
+<div class="jq_a" style="display:none;">
+Body 2
+</div>
+<div class="jq_h">
+'''Head 3'''
 </div>
+<div class="jq_a" style="display:none;">
+Body 3
 </div>
-<div id="J_FRAME" style="border: 1px black dotted; margin-top: 5px;" >
 </div>
+===Inline Test===
+Test <span class="jq_z fade_immediate">
+<span class="jq_h">
+| '''Head 1'''
+</span>
+<span class="jq_a">
+Body 1
+</span>
+<span class="jq_h">
+| '''Head 2'''
+</span>
+<span class="jq_a" style="display:none;">
+Body 2
+</span>
+</span> | Bla
+<pre>
+jQuery('.jq_z .jq_h').click(function() {
+    var $this = jQuery(this);
+    var speed = "fast";
+    if ($this.parents(".jq_z").hasClass("fade_slow"))
+        speed = "slow";
+    else if ($this.parents(".jq_z").hasClass("fade_immediate"))
+        speed = 0;
+    var $this = jQuery(this);
+    $this.parents(".jq_z").children(".jq_a").hide(speed);
+    $this.next(".jq_a").show(speed);
+});
+</pre>

Benutzer:J*/Spielwüste: Unterschied zwischen den Versionen

Aktuelle Version vom 21. Juli 2011, 15:47 Uhr

Inhaltsverzeichnis

JQuery Klappdings[<small>bearbeiten</small>]

Inline Test[<small>bearbeiten</small>]

Akkordeon[<small>bearbeiten</small>]

Inline Test[<small>bearbeiten</small>]

Navigationsmenü

Suche