!!! Dynamic styles
Dynamic styles provided more advanced styling for your pages, powered by a combination of ~JavaScript and CSS. 
They can add substantial visual experience to your wiki pages, though the structure of your pages 
and wiki markup remain unchanged. Actually, the pages are still fully accessible on browsers with JavaScript turned off. 

* %~%collapsebox -- Set a section (with a ! or !! or !!! header) into a collapsable box.  See [JSPWiki:CollapsibleBox]
* %~%collapse -- Turn ordinary lists into collapsible trees. See [JSPWiki:Collapsible List]
* %~%category -- Generates pop up with pages referenced by the category page. See [JSPWiki:Category Style] 
* %~%tip -- Generates a transparent fly-over tip with additional info. See [JSPWiki:Tip Style]
* %~%graphbar -- Add horizontal or vertical graph bars to your wikipages. See [JSPWiki:GraphBars]
* %~%sortable -- Turn ordinary wiki tables into sortable tables. See [JSPWiki:Sortable Tables] 
* %~%table-filter -- Turn ordinary wiki tables into Excel-like filtered tables. See [JSPWiki:Filtered Tables] 
* %~%zebra-table -- Add alternate row colors to your tables. See [JSPWiki:Zebra Table Style]
* %~%columns -- Format text in multi-column news-paper format. See [JSPWiki:Multi Columns Style]
* %~%prettify -- Add code-coloring to a preformatted block of text. See [JSPWiki:Prettify Sourcecode]

!! Examples

! %~%collapse

%%collapse
* The pomme fruits:
** Apples
*** Apple
*** Chokeberry
** Pear
*** European 
*** Asian
* The stone fruits, drupes of genus Prunus:
** Apricot
** Cherry
** Chokecherry
** Plum
** Peach
/%

! %~%category
Clicking the ''category'' %%category [JSPWiki:JSPWikiStyles] /% reveals all pages linking to [JSPWiki:JSPWikiStyles]

! %~%tip
Hover your mouse over the %%tip-Assessments  Lorem ipsum dolor sit amet,\\ consectetuer adipiscing elit.\\ Donec dictum velit eget risus.\\ Fusce ligula.\\ /% tip to see the nice tip.

! %~%sortable
%%sortable
|| Title || Author || Published   || Edition || Some IP@        || Expenses
| book1  |  zappy  |  25 Feb 2005 |  5       |  100.100.100.100 |  €500
| book2  |  happy  |  25 Jan 2005 |  19      |  256.100.100.100 |  €1500
| book3  |  pappy  |  23 Mar 2005 |  06      |  10.100.100.100  |  €50
| book4  |  dappy  |  21 Apr 2005 |  199     |  1.100.100.100   |  €0.500
| book5  |  rappy  |  25 Jul 2005 |  017     |  1.100.25.100    |  €5500
| book5  |  rappy  |  23 Jan 2006 |  017     |  1.100.25.100    |  €5500
/%

! %~%table-filter
%%table-filter
|| Title || Author || Published   || Edition || Some IP@        || Expenses
| book1  |  zappy  |  25 Feb 2005 |  5       |  100.100.100.100 |  €500
| book2  |  happy  |  25 Jan 2005 |  19      |  256.100.100.100 |  €1500
| book3  |  pappy  |  23 Mar 2005 |  06      |  10.100.100.100  |  €50
| book4  |  dappy  |  21 Apr 2005 |  199     |  1.100.100.100   |  €0.500
| book5  |  rappy  |  25 Jul 2005 |  017     |  1.100.25.100    |  €5500
/%

! %~%zebra-table
%%zebra-ffe0e0-ffff80
|| column-head1 || column-head2 
| cell-data | cell data 
| cell-data | cell data 
| cell-data | cell data 
| cell-data | cell data 
/% 
You may indicate simply __%~%zebra-table__ and you get a basic white/light blue alternation or you can specify the two colors to alternate with (for example) __%~%zebra-ffe0e0-ffff80__ and you will get as shown above.


----
![Notes|Edit:Internal.WIKI.STYLING+DYNAMICS] 	
[{InsertPage page='Internal.WIKI.STYLING+DYNAMICS' default='Click to create a new notes page'}]