Hilfe:Diaschau: Unterschied zwischen den Versionen

Aus SchnuppTrupp
Wechseln zu: Navigation, Suche
K (Optionen für die Diaschau)
K (Option next)
Zeile 211: Zeile 211:
 
*''Text'' -> der Text wir als Link angezeigt
 
*''Text'' -> der Text wir als Link angezeigt
 
oder
 
oder
*''Bild'' -> das Bild wird als Link angezeigt ('''ACHTUNG:''' Das Bild selbst darf kein Link sein, den internen Wikilink ausschalten mit <nowiki>[[Image:meinblild.png|link=]]</nowiki>)
+
*''Bild'' -> das Bild wird als Link angezeigt ('''ACHTUNG:''' Das Bild selbst darf kein Link sein, den internen Wikilink ausschalten mit ''<nowiki>[[Image:meinblild.png|link=]]</nowiki>'')
  
 
=== Option previous ===
 
=== Option previous ===

Version vom 8. Dezember 2010, 16:56 Uhr

Ihr könnt an beliebiger Stelle auf einer Wikiseite eine Diaschau erstellen bzw. einfügen. hier findet ihr eine Erklärung dazu was die Diaschau alles kann und wie ihr das Verhalten beeinflussen könnt.

Diaschau erstellen

Eine Diaschau besteht aus zwei oder mehreren Bildern, Tabellen oder Texten. Jede dem Wiki bekannte Möglichkeit sollte funktionieren. In dieser Hilfe werden wir eine Diaschau aus allen möglichen Elementen erstellen um euch die Funktion zu beschreiben.

Elemente für die Diaschau

Bild

Folgendes Bild soll in der Diaschau gezeigt werden

Schnupptrupp-titel.jpeg

in der Wikischreibweise wird das Bild so eingebunden

<center>[[Image:Schnupptrupp-titel.jpeg]]</center>

um das ganze in der Diaschau einbinden zu können müssen wir das ganze in ein DIV Element einbetten

<div><center>[[Image:Schnupptrupp-titel.jpeg]]</center></div>

formatierter Text

Als zweites Element wollen wir einen Text in der Diaschau einfügen



Der Schnupptrupp
kein Clan aber eine starke Gemeinschaft



in der Wikischreibweise würde das ganze so aussehen

<center><br><br><br><span style="font-size: xx-large;">Der Schnupptrupp</span><br>
<span style="font-size: larger;">'''kein''' ''Clan'' aber eine '''starke''' ''Gemeinschaft''</span><br><br><br></center>

da der formatierte Textbereich keine festen Dimmensionen in Breite und Höhe hat sollten wir das ganze ein ein DIV Element einbetten in welchem wir die Breite und eventuell eine Höhe festlegen

<div style="width: 600px;"<center><br><br><br><span style="font-size: xx-large;">Der Schnupptrupp</span><br>
<span style="font-size: larger;">'''kein''' ''Clan'' aber eine '''starke''' ''Gemeinschaft''</span><br><br><br></center></div>

den fertigen text betten wir dann komplett nochmal in ein DIV Element ein

<div>
<div style="width: 600px;"<center><br><br><br><span style="font-size: xx-large;">Der Schnupptrupp</span><br>
<span style="font-size: larger;">'''kein''' ''Clan'' aber eine '''starke''' ''Gemeinschaft''</span><br><br><br></center></div>
</div>

eine Tabelle

auch eine Tabelle kann in der Diaschau angezeigt werden. Folgende Tabelle soll in unserer Diaschau angezeigt werden

Der Schnupptrupp kein Clan starke Gemeinschaft
immer am Schnuppensuchen keine Ränge Hilfe in und um Runescape
regelmäßige gemeinschaftliche Aktivitäten aber nicht nur ein Chat Webseite und Forum

in der Wikischreibweise würde das ganze so aussehen

{| align="center" cellspacing="1" cellpadding="1" border="2" style="width: 547px; height: 156px;"
|-
! bgcolor="#993300" scope="col" | Der Schnupptrupp
! bgcolor="#993300" scope="col" | kein Clan
! bgcolor="#993300" scope="col" | starke Gemeinschaft
|-
| align="center" bgcolor="#cccccc" | immer am Schnuppensuchen
| align="center" bgcolor="#cccccc" | keine Ränge
| align="center" bgcolor="#cccccc" | Hilfe in und um Runescape
|-
| align="center" bgcolor="#cccccc" | regelmäßige gemeinschaftliche Aktivitäten
| align="center" bgcolor="#cccccc" | aber nicht nur ein Chat
| align="center" bgcolor="#cccccc" | Webseite und Forum
|}

auch diese Tabelle betten wir wieder in ein DIV Element ein, bei Tabellen ist es jedoch wichtig das die DIV Elemente immer in einer extra Zeile stehen

<div>
{| align="center" cellspacing="1" cellpadding="1" border="2" style="width: 600px; height: 156px;"
|-
! bgcolor="#993300" scope="col" | Der Schnupptrupp
! bgcolor="#993300" scope="col" | kein Clan
! bgcolor="#993300" scope="col" | starke Gemeinschaft
|-
| align="center" bgcolor="#cccccc" | immer am Schnuppensuchen
| align="center" bgcolor="#cccccc" | keine Ränge
| align="center" bgcolor="#cccccc" | Hilfe in und um Runescape
|-
| align="center" bgcolor="#cccccc" | regelmäßige gemeinschaftliche Aktivitäten
| align="center" bgcolor="#cccccc" | aber nicht nur ein Chat
| align="center" bgcolor="#cccccc" | Webseite und Forum
|}
</div>

eine einfache Diaschau

Um aus diesen drei Elementen eine Diaschau zu erstellen, betten wir das ganze in das spezielle Element <slideshow></slideshow> ein.

Im der Wikischreibweise würde das ganze dann so aussehen

<slideshow>
<div><center>[[Image:Schnupptrupp-titel.jpeg]]</center></div>
<div><center><br><br><br><span style="font-size: xx-large;">Der Schnupptrupp</span><br>
<span style="font-size: larger;">'''kein''' ''Clan'' aber eine '''starke''' ''Gemeinschaft''</span><br><br><br></center></div>
<div>{| align="center" cellspacing="1" cellpadding="1" border="2" style="width: 600px; height: 156px;"
|-
! bgcolor="#993300" scope="col" | Der Schnupptrupp
! bgcolor="#993300" scope="col" | kein Clan
! bgcolor="#993300" scope="col" | starke Gemeinschaft
|-
| align="center" bgcolor="#cccccc" | immer am Schnuppensuchen
| align="center" bgcolor="#cccccc" | keine Ränge
| align="center" bgcolor="#cccccc" | Hilfe in und um Runescape
|-
| align="center" bgcolor="#cccccc" | regelmäßige gemeinschaftliche Aktivitäten
| align="center" bgcolor="#cccccc" | aber nicht nur ein Chat
| align="center" bgcolor="#cccccc" | Webseite und Forum
|}</div>
</slideshow>

und so sieht das Ergebnis aus

Schnupptrupp-titel.jpeg



Der Schnupptrupp
kein Clan aber eine starke Gemeinschaft


Der Schnupptrupp kein Clan starke Gemeinschaft
immer am Schnuppensuchen keine Ränge Hilfe in und um Runescape
regelmäßige gemeinschaftliche Aktivitäten aber nicht nur ein Chat Webseite und Forum

das ist schon mal ein schönes Ergebnis aber noch nicht wirklich benutzbar. Die einzelnen Elemente wechseln viel zu schnell und die Reihenfolge der Elemente ist zufällig. Also sollten wir noch durch Optionen auf das verhalten der Diaschau Einfluss nehmen.

Optionen für die Diaschau

Folgende Optionen sind möglich

  • sequence
  • transition
  • refresh
  • position
  • next
  • previous

Option sequence

Die Option sequence legt fest in welcher Reihenfloge die Diaschau ablaufen soll. Möglich sind folgende Werte

  • forward -> vorwärts
  • backward -> rückwärts
  • random -> zufällig (das ist die Standard Einstellung wenn diese Option nicht angegeben wird)

Option transition

Die Option transition legt fest wie der Wechsel zum nächsten Element dargestellt wird. Möglich sind folgende Werte

  • cut -> harter Übergang (das ist die Standard Einstellung wenn diese Option nicht angegeben wird)
  • fade -> weicher Übergang (ausblenden/einblenden)

Option refresh

Die Option refresh legt fest, wie lange ein Element angezeigt wird. Möglich sind folgende Werte

  • Zahl -> Zeit in Millisekunden
  • user -> es wird eine Navigation angezeigt mit welcher der Benutzer vor/zurückblättern kann.

Option position

Die Option position legt fest, wie viele Pixel vom linken Rand die Navigation angezeigt wird. Diese Option ist nur aktiv wenn die Option refresh="user" gesetzt ist.

  • zahl -> Abstand vom linken Rand in Pixel

Option next

Die Option next legt fest, welcher Text oder welches Bild angezeigt wird, um auf das nächste Element zu wechseln. Diese Option ist nur aktiv wenn die Option refresh="user" gesetzt ist.

  • Text -> der Text wir als Link angezeigt

oder

  • Bild -> das Bild wird als Link angezeigt (ACHTUNG: Das Bild selbst darf kein Link sein, den internen Wikilink ausschalten mit [[Image:meinblild.png|link=]])

Option previous

Die Option previous ist das Gegenstück zur Option next und legt den Text bzw. das Bild fest welches als Link angezeigt wird um auf das vorhergehende Element zu wechseln. Diese Option ist nur aktiv wenn die Option refresh="user" gesetzt ist.

  • Text -> der Text wir als Link angezeigt

oder

  • Bild -> das Bild wird als Link angezeigt (ACHTUNG: Das Bild selbst darf kein Link sein, den internen Wikilink ausschalten mit [[Image:meinblild.png|link=]])