Vorlage:Klappbox: Unterschied zwischen den Versionen
Zur Navigation springen
Zur Suche springen
| [gesichtete Version] | [gesichtete Version] |
CF (Diskussion | Beiträge) KKeine Bearbeitungszusammenfassung |
K 0% ist glaube ich sinnvoller |
||
| Zeile 1: | Zeile 1: | ||
<includeonly><div class="collapsibletemplate plainlinks {{#ifeq:{{uc:{{{ZUSTAND|VERSTECKT}}}}}|VERSTECKT|collapsed|expanded}}" style="{{{STYLE|clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;}}}"> | <includeonly><div class="collapsibletemplate plainlinks {{#ifeq:{{uc:{{{ZUSTAND|VERSTECKT}}}}}|VERSTECKT|collapsed|expanded}}" style="{{{STYLE|clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;}}}"> | ||
<div class="collapsibleheader header" style="display:none; margin-left: {{{TITELPOSITION| | <div class="collapsibleheader header" style="display:none; margin-left: {{{TITELPOSITION|0}}}%; margin-top: 2px;" > | ||
'''{{{TITEL|Überschrift}}}'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | '''{{{TITEL|Überschrift}}}'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | ||
{{{INHALT|Inhalt}}} | {{{INHALT|Inhalt}}} | ||
| Zeile 9: | Zeile 9: | ||
* Der Parameter <var>TITEL</var> gibt die Überschrift an. Hier empfiehlt es sich die Überschrift „Hier klicken um <Inhalt> anzuzeigen“ zu verwenden. | * Der Parameter <var>TITEL</var> gibt die Überschrift an. Hier empfiehlt es sich die Überschrift „Hier klicken um <Inhalt> anzuzeigen“ zu verwenden. | ||
* Der Parameter <var>INHALT</var> enthält den Inhalt der Box. | * Der Parameter <var>INHALT</var> enthält den Inhalt der Box. | ||
* Der Parameter <var>TITELPOSITION</var> gibt den Abstand der Überschrift zum linken Rand der Seite an. '''Optional:''' Vordefinierter Wert ist | * Der Parameter <var>TITELPOSITION</var> gibt den Abstand der Überschrift zum linken Rand der Seite an. '''Optional:''' Vordefinierter Wert ist 0%, sprich der Titel ist links platziert. | ||
* Über den Parameter <var>ZUSTAND</var> kann bestimmt werden, ob die Box am Anfang sichtbar oder unsichtbar erscheint. Wenn ''VERSTECKT'' eingegeben wird ist der Inhalt nicht sichtbar. | * Über den Parameter <var>ZUSTAND</var> kann bestimmt werden, ob die Box am Anfang sichtbar oder unsichtbar erscheint. Wenn ''VERSTECKT'' eingegeben wird ist der Inhalt nicht sichtbar. | ||
* Mit dem Parameter <var>STYLE</var> kann das aussehen der Box mittels {{wp|Cascading Style Sheets|CSS}} bestimmt werden; wird der Parameter nicht angegeben erscheint die Box mit grauen Rahmen. | * Mit dem Parameter <var>STYLE</var> kann das aussehen der Box mittels {{wp|Cascading Style Sheets|CSS}} bestimmt werden; wird der Parameter nicht angegeben erscheint die Box mit grauen Rahmen. | ||
| Zeile 22: | Zeile 22: | ||
ergibt: | ergibt: | ||
<div class="collapsibletemplate plainlinks {{#ifeq:{{uc:VERSTECKT}}|VERSTECKT|collapsed|expanded}}" style="clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;"> | <div class="collapsibletemplate plainlinks {{#ifeq:{{uc:VERSTECKT}}|VERSTECKT|collapsed|expanded}}" style="clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;"> | ||
<div class="collapsibleheader header" style="display:none; margin-left: | <div class="collapsibleheader header" style="display:none; margin-left: 0%; margin-top: 2px;" > | ||
'''Hier klicken um Text anzuzeigen'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | '''Hier klicken um Text anzuzeigen'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | ||
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. | ||
| Zeile 37: | Zeile 37: | ||
ergibt: | ergibt: | ||
<div class="collapsibletemplate plainlinks {{#ifeq:{{uc:SICHTBAR}}|VERSTECKT|collapsed|expanded}}" style="clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;"> | <div class="collapsibletemplate plainlinks {{#ifeq:{{uc:SICHTBAR}}|VERSTECKT|collapsed|expanded}}" style="clear:both; border:1px #aaaaaa solid; padding-bottom:2px; background-color:#F5F5F5;"> | ||
<div class="collapsibleheader header" style="display:none; margin-left: | <div class="collapsibleheader header" style="display:none; margin-left: 0%; margin-top: 2px;" > | ||
'''Hier ist weiterer Text versteckt'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | '''Hier ist weiterer Text versteckt'''</div><div class="body show-on-commons" style="padding:8px 8px 0px; "> | ||
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. | Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. | ||
| Zeile 47: | Zeile 47: | ||
| TITEL = Weiterer Text | | TITEL = Weiterer Text | ||
| INHALT = Lorem ipsum … | | INHALT = Lorem ipsum … | ||
| TITELPOSITION = 10 | | TITELPOSITION = 10 | ||
| STYLE = border: 2px dashed red; background-color: green; | | STYLE = border: 2px dashed red; background-color: green; | ||
}} | }} | ||
Version vom 27. August 2010, 17:42 Uhr
Diese Vorlage Klappbox ist vectorbasiert und erzeugt eine animierte Ausklappbox.
Parameter
- Der Parameter TITEL gibt die Überschrift an. Hier empfiehlt es sich die Überschrift „Hier klicken um <Inhalt> anzuzeigen“ zu verwenden.
- Der Parameter INHALT enthält den Inhalt der Box.
- Der Parameter TITELPOSITION gibt den Abstand der Überschrift zum linken Rand der Seite an. Optional: Vordefinierter Wert ist 0%, sprich der Titel ist links platziert.
- Über den Parameter ZUSTAND kann bestimmt werden, ob die Box am Anfang sichtbar oder unsichtbar erscheint. Wenn VERSTECKT eingegeben wird ist der Inhalt nicht sichtbar.
- Mit dem Parameter STYLE kann das aussehen der Box mittels CSS bestimmt werden; wird der Parameter nicht angegeben erscheint die Box mit grauen Rahmen.
Beispiele
{{Klappbox
|TITEL = Hier klicken um Text anzuzeigen
|INHALT = Lorem ipsum …
}}
ergibt:
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
{{Klappbox
| TITEL = Hier ist weiterer Text versteckt
| INHALT = Lorem ipsum …
| ZUSTAND = SICHTBAR
}}
ergibt:
{{Klappbox
| TITEL = Weiterer Text
| INHALT = Lorem ipsum …
| TITELPOSITION = 10
| STYLE = border: 2px dashed red; background-color: green;
}}
ergibt:
Lorem ipsum dolor sit amet, consectetur adipisici elit, sed eiusmod tempor incidunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquid ex ea commodi consequat. Quis aute iure reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint obcaecat cupiditat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.