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
-* eine oder mehrere Quellen (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.
-Benutz einfach meine Klickboxen da unten und setze dir die entsprechenden Vorlagen in den Beschreibungstext (auch gern mehrere Quellen, Schlüsselworte oder was auch immer). Wenn du dich vertippt hast oder etwas ändern oder löschen möchtest, kann ich dir leider nicht helfen. Bitte lösche die entsprechenden Zeilen selbst unten im Beschreibungstext.
+===Inline Test===
-<div>'''Die Klickboxen sind momentan in der Erprobungsphase. Bitte sag [[Forum:Bildlizenzen|da]] oder [[Kamel Diskussion:J*|da]] Bescheid, wenn etwas nicht funktioniert. Es könnte aber auch schon helfen, den Browser-Cache zu leeren.'''</div>
-|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;">
-|}
+<span class="jq_kd" style="border: 1px blue solid;">
-<div id="klicktag">
+Visible. <span class="jq_tr" style="border: 1px red solid;">TRIG</span>
-Leider kann Wiki dir nicht helfen, wenn du dein Javascript ausgeschaltet hast. Also mach's entweder selber oder schalt dein Javascript ein!
+</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