nessun oggetto della modifica
MFH (rosica | curriculum) m (→toggleLink) |
MFH (rosica | curriculum) Nessun oggetto della modifica |
||
Riga 34:
<div id="provaToggleExpandText" style="display:none;">Aprimi</div>
<div id="provaToggleCollapseText" style="display:none;">Chiudimi</div>
<span id="provaToggle">Questo testo è visibile, ma se clicchi su ''Chiudimi'' scompare:</span><span class="toggleLink" id="provaToggleLink"></span></nowiki>
produce:
<div style="background: #CCFFCC; border: 1px dotted; padding: 2px"><div id="provaToggleInitialState" style="display:none;">1</div>
<div id="provaToggleExpandText" style="display:none;">Aprimi</div>
<div id="provaToggleCollapseText" style="display:none;">Chiudimi</div>
<span id="provaToggle">Questo testo è visibile, ma se clicchi su ''Chiudimi'' scompare:</span><span class="toggleLink" id="provaToggleLink"></span></div>
==morphMaster==
Line 71 ⟶ 69:
Il codice
<nowiki><div class="morphMaster" id="provaMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<span id="provaMorphLinkPrev">Precedente</span> • <span id="provaMorphLink1">Contenuto 1</span> • <span id="provaMorphLink2">Contenuto 2</span> • <span id="provaMorphLink3">Contenuto 3</span> • <span id="provaMorphLinkNext">Successivo</span>
<div id="provaMorphContent1" style="display:none;">Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaMorphContent2" style="display:none;">Questo è il contenuto numero 2</div>
Line 81 ⟶ 75:
produce
<div style="background: #CCFFCC; border: 1px dotted; padding: 2px"><div class="morphMaster" id="provaMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<span id="provaMorphLinkPrev">Precedente</span> • <span id="provaMorphLink1">Contenuto 1</span> • <span id="provaMorphLink2">Contenuto 2</span> • <span id="provaMorphLink3">Contenuto 3</span> • <span id="provaMorphLinkNext">Successivo</span>
<div id="provaMorphContent1" style="display:none;">Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaMorphContent2" style="display:none;">Questo è il contenuto numero 2</div>
Line 108 ⟶ 98:
La differenza con i link precedenti è semplicemente che in questo caso vengono usate le classi invece degli ID, col risultato che si possono inserire più link diretti allo stesso contenuto, e anche più link sequenziali.
;Esempio
Questa è una piccola variazione della situazione precedente
<nowiki><div class="multiMorphMaster" id="provaMultiMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<div id="provaMultiMorphContent1" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink2">Contenuto 2</span> • <span class="provaMultiMorphLink3">Contenuto 3</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaMultiMorphContent2" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink1">Contenuto 1</span> • <span class="provaMultiMorphLink3">Contenuto 3</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 2</div>
<div id="provaMultiMorphContent3" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink1">Contenuto 1</span> • <span class="provaMultiMorphLink2">Contenuto 2</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 3</div></nowiki>
produce
<div style="background: #CCFFCC; border: 1px dotted; padding: 2px"><div class="multiMorphMaster" id="provaMultiMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<div id="provaMultiMorphContent1" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink2">Contenuto 2</span> • <span class="provaMultiMorphLink3">Contenuto 3</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaMultiMorphContent2" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink1">Contenuto 1</span> • <span class="provaMultiMorphLink3">Contenuto 3</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 2</div>
<div id="provaMultiMorphContent3" style="display:none;"><span class="provaMultiMorphLinkPrev">Precedente</span> • <span class="provaMultiMorphLink1">Contenuto 1</span> • <span class="provaMultiMorphLink2">Contenuto 2</span> • <span class="provaMultiMorphLinkNext">Successivo</span><br />Questo è il contenuto numero 3</div></div>
==galleryMorphMaster==
Line 122 ⟶ 124:
;Link
*Link al contenuto precedente
<nowiki><div</nowiki> id="''nome''LinkPrev" style="display:none;">''Testo''</div>
*Link al contenuto successivo
<nowiki><div</nowiki> id="''nome''LinkNext">''Testo''</div>
Line 128 ⟶ 130:
;Contatore
<nowiki><div</nowiki> id="''nome''Counter">''Testo''</div>
;Esempio
Anche questa è una piccola variazione della situazione precedente
<nowiki><span id="provaGalleryMorphLinkPrev" style="display:none; float:left; position:relative; top:2px; left:2px;">Precedente</span><span id="provaGalleryMorphLinkNext" style="float:right; position:relative; top:2px; right:2px;">Successivo</span><br clear="both" />
<div class="galleryMorphMaster" id="provaGalleryMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<div id="provaGalleryMorphCounter" style="text-align:center;">(1/?)</div>
<div id="provaGalleryMorphContent1" style="display:none;">Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaGalleryMorphContent2" style="display:none;">Questo è il contenuto numero 2</div>
<div id="provaGalleryMorphContent3" style="display:none;">Questo è il contenuto numero 3</div></nowiki>
produce
<div style="background: #CCFFCC; border: 1px dotted; padding: 2px"><span id="provaGalleryMorphLinkPrev" style="display:none; float:left; position:relative; top:2px; left:2px;">Precedente</span><span id="provaGalleryMorphLinkNext" style="float:right; position:relative; top:2px; right:2px;">Successivo</span><br clear="both" />
<div class="galleryMorphMaster" id="provaGalleryMorphMaster" style="text-decoration:blink;">Attendere, caricamento in corso...</div>
<div id="provaGalleryMorphCounter" style="text-align:center;">(1/?)</div>
<div id="provaGalleryMorphContent1" style="display:none;">Questo è il contenuto numero 1, che verrà visualizzato dopo il caricamento del Morph.</div>
<div id="provaGalleryMorphContent2" style="display:none;">Questo è il contenuto numero 2</div>
<div id="provaGalleryMorphContent3" style="display:none;">Questo è il contenuto numero 3</div></div>
==Note==
| |||