{\rtf1\ansi\deff3\adeflang1025
{\fonttbl{\f0\froman\fprq2\fcharset0 Times New Roman;}{\f1\froman\fprq2\fcharset2 Symbol;}{\f2\fswiss\fprq2\fcharset0 Arial;}{\f3\froman\fprq2\fcharset128 Tinos;}{\f4\froman\fprq2\fcharset128 Thorndale{\*\falt Times New Roman};}{\f5\fswiss\fprq2\fcharset128 Albany{\*\falt Arial};}{\f6\fnil\fprq2\fcharset128 HG Mincho Light J{\*\falt msmincho};}{\f7\fnil\fprq2\fcharset128 Arimo{\*\falt arial};}{\f8\fnil\fprq2\fcharset128 Arial Unicode MS;}{\f9\fnil\fprq2\fcharset128 Nimbus Sans;}{\f10\fswiss\fprq0\fcharset128 Nimbus Sans;}}
{\colortbl;\red0\green0\blue0;\red0\green0\blue128;\red188\green122\blue0;\red25\green23\blue124;\red102\green102\blue102;\red186\green33\blue33;\red204\green204\blue204;\red128\green128\blue128;}
{\stylesheet{\s0\snext0\nowidctlpar{\*\hyphen2\hyphlead0\hyphtrail0\hyphmax0}\cf0\hich\af7\langfe2052\dbch\af9\afs24\lang1081\loch\f3\fs24\lang1033 Default;}
{\s1\sbasedon27\snext26\sb240\sa283\keepn\b\hich\af6\dbch\af8\afs48\ab\loch\f4\fs48 Heading 1;}
{\s2\sbasedon27\snext26\ilvl1\outlinelevel1\sb240\sa283\keepn\b\hich\af7\dbch\af9\afs36\ab\loch\f3\fs36 Heading 2;}
{\*\cs15\snext15 Endnote Characters;}
{\*\cs16\snext16 Footnote Characters;}
{\*\cs17\snext17\cf2\ul\ulc0 Internet Link;}
{\s18\sbasedon0\snext26\sb0\sa283\brdrb\brdrdb\brdrw15\brdrcf8\brsp0{\*\brdrb\brdlncol8\brdlnin1\brdlnout1\brdlndist20}\brsp0\fs12 Horizontal Line;}
{\s19\sbasedon0\snext19\i Sender;}
{\s20\sbasedon26\snext20\sb0\sa283 Table Contents;}
{\s21\sbasedon0\snext21\tqc\tx4818\tqr\tx9637\noline Footer;}
{\s22\sbasedon0\snext22\tqc\tx4818\tqr\tx9637\noline Header;}
{\s23\sbasedon0\snext23\noline\dbch\af10 Index;}
{\s24\sbasedon0\snext24\sb120\sa120\noline\i\dbch\af10\afs24\ai\fs24 Caption;}
{\s25\sbasedon26\snext25\sb0\sa283\dbch\af10 List;}
{\s26\sbasedon0\snext26\sb0\sa283 Text body;}
{\s27\sbasedon0\snext26\sb240\sa283\keepn\hich\af6\dbch\af8\afs28\loch\f5\fs28 Heading;}
}{\info{\title  Macros - Show Hide Macro }{\creatim\yr0\mo0\dy0\hr0\min0}{\revtim\yr0\mo0\dy0\hr0\min0}{\printim\yr0\mo0\dy0\hr0\min0}{\comment OpenOffice}{\vern4120}}

{\*\pgdsctbl
{\pgdsc0\pgdscuse195\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn1134\margtsxn1134\margbsxn1134\pgdscnxt0 Default;}
{\pgdsc1\pgdscuse195\pgndec\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn1134\margtsxn1134\margbsxn1134\pgdscnxt1 Endnote;}
{\pgdsc2\pgdscuse195\pgndec\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn567\margtsxn567\margbsxn567\pgdscnxt2 HTML;}}
\formshade{\*\pgdscno2}\paperh16838\paperw11906\margl1134\margr567\margt567\margb567\sectd\sbknone\sectunlocked1\pgndec\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn567\margtsxn567\margbsxn567\ftnbj\ftnstart1\ftnrstcont\ftnnar\aenddoc\aftnrstcont\aftnstart1\aftnnrlc
\pgndec\pard\plain \s26\sb0\sa283\sb0\sa0{\rtlch \ltrch\loch
Macros - Show Hide Macro }
\par \pard\plain \s26\sb0\sa283{\rtlch \ltrch\loch
Page of - last modified by Helge Dahl on 2018/01/22 10:41 }
\par \pard\plain \s1\sb240\sa283\keepn\b\hich\af6\dbch\af8\afs48\ab\loch\f4\fs48\qc{\rtlch \ltrch\loch
Show Hide Macro }
\par \pard\plain \s26\sb0\sa283\qc{\rtlch \ltrch\loch
}
\par \pard\plain \s26\sb0\sa283\qc{\rtlch \ltrch\loch
Helge Dahl}
\par \pard\plain \s26\sb0\sa283\qc{\rtlch \ltrch\loch
}
\par \pard\plain \s26\sb0\sa283\qc{\rtlch \ltrch\loch
2018/01/22 10:41}
\par \pard\plain \s1\sb240\sa283\keepn\b\hich\af6\dbch\af8\afs48\ab\loch\f4\fs48\pagebb{\rtlch \ltrch\loch
Table of Contents}
\par \pard\plain \s26\sb0\sa283\li240\ri0\lin240\rin0\fi0\sb0\sa0{{\field{\*\fldinst HYPERLINK "#HWithouteffect" }{\fldrslt \cf2\ul\ulc0\rtlch \ltrch\loch
Without effect}}}
\par \pard\plain \s26\sb0\sa283\li240\ri0\lin240\rin0\fi0\sb0\sa0{{\field{\*\fldinst HYPERLINK "#HWithafadeineffect" }{\fldrslt \cf2\ul\ulc0\rtlch \ltrch\loch
With a fade in effect}}}
\par \pard\plain \s26\sb0\sa283\li240\ri0\lin240\rin0\fi0{{\field{\*\fldinst HYPERLINK "#HWithaslidingdowneffect" }{\fldrslt \cf2\ul\ulc0\rtlch \ltrch\loch
With a sliding down effect}}}
\par \pard\plain \s26\sb0\sa283\pagebb{\rtlch \ltrch\loch
}
\par \sect\sectd\sectunlocked1\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn567\margtsxn567\margbsxn567\ltrsect\sbknone\pard\plain \s26\sb0\sa283{\rtlch \ltrch\loch
}
\par \sect\sectd\sectunlocked1\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn567\margtsxn567\margbsxn567\ltrsect\sbknone\pard\plain \s26\sb0\sa283{\rtlch \ltrch\loch
Wiki macros implementation for simple show/hide of a content with some animations.\line This version 2.0 is HTML compatible with the old version, so that existing project could continue styling \line with the same kind of CSS rules. However, it is now based on jQuery, and need requireJS, so it requires\line XWiki 5.x or more.}
\par \pard\plain \s26\sb0\sa283{\rtlch \ltrch\loch
Using id="..." is still supported and provide the same HTML result but it is no more needed to achieve a working animation.}
\par \pard\plain \s2\ilvl1\outlinelevel1\sb240\sa283\keepn\b\hich\af7\dbch\af9\afs36\ab\loch\f3\fs36{{\*\bkmkstart HWithouteffect}{\*\bkmkend HWithouteffect}\rtlch \ltrch\loch
Without effect}
\par \pard\plain \s26\sb0\sa283{{\field{\*\fldinst HYPERLINK "javascript:void(0)" }{\fldrslt \cf2\ul\ulc0\chcbpat7\rtlch \ltrch\loch
Show}}}
\par \pard\plain \s26\sb0\sa283{\chcbpat7\rtlch \ltrch\loch
Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible}
\par \pard\plain \s26\sb0\sa283{\cf3\rtlch \ltrch\loch
\{\{}{\cf4\rtlch \ltrch\loch
showhide}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
showmessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Show"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
hidemessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Hide"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
style}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"background-color: #ccc"}{\cf3\rtlch \ltrch\loch
\}\}}{\rtlch \ltrch\loch
\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line }{\cf3\rtlch \ltrch\loch
\{\{}{\cf5\rtlch \ltrch\loch
/}{\cf4\rtlch \ltrch\loch
showhide}{\cf3\rtlch \ltrch\loch
\}\}}
\par \pard\plain \s2\ilvl1\outlinelevel1\sb240\sa283\keepn\b\hich\af7\dbch\af9\afs36\ab\loch\f3\fs36{{\*\bkmkstart HWithafadeineffect}{\*\bkmkend HWithafadeineffect}\rtlch \ltrch\loch
With a fade in effect}
\par \pard\plain \s26\sb0\sa283{{\field{\*\fldinst HYPERLINK "javascript:void(0)" }{\fldrslt \cf2\ul\ulc0\chcbpat7\rtlch \ltrch\loch
Show}}}
\par \pard\plain \s26\sb0\sa283{\chcbpat7\rtlch \ltrch\loch
Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible}
\par \pard\plain \s26\sb0\sa283\sb0\sa0{\cf3\rtlch \ltrch\loch
\{\{}{\cf4\rtlch \ltrch\loch
showhide}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
showmessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Show"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
hidemessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Hide"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
effect}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"fade"}{\rtlch \ltrch\loch
 \~ }{\cf4\rtlch \ltrch\loch
effectduration}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"2"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
style}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"background-color: #ccc"}{\cf3\rtlch \ltrch\loch
\}\}}{\rtlch \ltrch\loch
\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line }{\cf3\rtlch \ltrch\loch
\{\{}{\cf5\rtlch \ltrch\loch
/}{\cf4\rtlch \ltrch\loch
showhide}{\cf3\rtlch \ltrch\loch
\}\}}
\par \pard\plain \s26\sb0\sa283{\rtlch \ltrch\loch
Using effect="appear" is still supported and provide the same behavior}
\par \pard\plain \s2\ilvl1\outlinelevel1\sb240\sa283\keepn\b\hich\af7\dbch\af9\afs36\ab\loch\f3\fs36{{\*\bkmkstart HWithaslidingdowneffect}{\*\bkmkend HWithaslidingdowneffect}\rtlch \ltrch\loch
With a sliding down effect}
\par \pard\plain \s26\sb0\sa283{{\field{\*\fldinst HYPERLINK "javascript:void(0)" }{\fldrslt \cf2\ul\ulc0\chcbpat7\rtlch \ltrch\loch
Show}}}
\par \pard\plain \s26\sb0\sa283{\chcbpat7\rtlch \ltrch\loch
Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible}
\par \pard\plain \s26\sb0\sa283\sb0\sa0{\cf3\rtlch \ltrch\loch
\{\{}{\cf4\rtlch \ltrch\loch
showhide}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
showmessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Show"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
hidemessage}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"Hide"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
effect}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"slide"}{\rtlch \ltrch\loch
 \~ }{\cf4\rtlch \ltrch\loch
effectduration}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"0.5"}{\rtlch \ltrch\loch
 }{\cf4\rtlch \ltrch\loch
style}{\cf5\rtlch \ltrch\loch
=}{\cf6\rtlch \ltrch\loch
"background-color: #ccc"}{\cf3\rtlch \ltrch\loch
\}\}}{\rtlch \ltrch\loch
\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line Here is some hidden content that can become visible\line }{\cf3\rtlch \ltrch\loch
\{\{}{\cf5\rtlch \ltrch\loch
/}{\cf4\rtlch \ltrch\loch
showhide}{\cf3\rtlch \ltrch\loch
\}\}}
\par \pard\plain \s26\sb0\sa283\sb0\sa0{\rtlch \ltrch\loch
This effect is equivalent to effect="blind" in the 1.0 macro, so both slide and blind effect are now using the exact same animation.}
\par \sect\sectd\sectunlocked1\pgwsxn11906\pghsxn16838\marglsxn1134\margrsxn567\margtsxn567\margbsxn567\pgndec\sbknone}