Wiki: WIKI.STYLING DYNAMICS

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#

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 JSPWiki:JSPWikiStyles

reveals all pages linking to JSPWiki:JSPWikiStyles

%%tip#

Hover your mouse over the Lorem ipsum dolor sit amet,
consectetuer adipiscing elit.
Donec dictum velit eget risus.
Fusce ligula.
tip to see the nice tip.

%%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#

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#

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 #

Click to create a new notes page