Dokuwiki for science

差分

この文書の現在のバージョンと選択したバージョンの差分を表示します。

この比較画面にリンクする

float_plugin [2016/10/30 23:39] (現在)
ライン 1: ライン 1:
 +======Float plugin======
 +This DokuWiki plugin creates various floating boxes. All designs are defined in the '​style.css'​ file of the plugin.
 +
 +:!: This function of the plugin is achieved by using '​**[[doku>​plugin:​wrap|Wrap plugin]]**'​. :!:
 +
 +:!: Development discontinued. :!:
 +
 +
 +=====Syntax=====
 +Use '​float'​ tag for starting the floating section, and put the class name of the style definition after a single space. And put closing tag after the floating contents.
 +<​code>​
 +<float (class-name)>​
 +
 +---floating contents---
 +
 +</​float>​
 +</​code>​
 +
 +This Wiki description creates the html as the following.\\ ​
 +If you want to modify the design of the background-image of the borders, modify the style definitions of '​boxtop','​boxinner'​ and '​boxbottom'​ .
 +<code html>
 +<div class="​(class-name)">​
 +  <div class="​boxtop"></​div>​
 +  <div class="​boxinner">​
 +
 +  ---floating contents---
 +  ​
 +  </​div>​
 +  <div class="​boxbottom"></​div>​
 +</​div>​
 +</​code>​
 +
 +
 +====How to clear the floating====
 +At first, install [[clear_plugin]]. Then you can clear floating modes by using '​%%<​clear/>​%%'​.
 +
 +=====Supported classes=====
 +<float left300>
 +**No-sizing**\\ ​
 +^class name^box, floating design^
 +|left|section floating to left|
 +|right|section floating to right|
 +|leftbox|box floating to left|
 +|rightbox|box floating to right|
 +</​float>​
 +<float left300>
 +**Size-defined**\\ ​
 +^class name^box, floating design^
 +|left200|section floating to left\\ (width:​200px)|
 +|right200|section floating to right\\ (width:​200px|
 +|leftbox200|round box floating to left\\ (width:​200px)|
 +|rightbox200|round box floating to right\\ (width:​200px)|
 +|(width of 300, 400 and 600 are also supported)||
 +</​float>​
 +<​clear/>​
 +
 +The tables above are aligned by using '​left300'​ class ;-)
 +
 +
 +
 +=====Example1. Floating boxes=====
 +<float rightbox200>​[The '​rightbox200'​ section]</​float>​
 +<float leftbox200>​[The '​leftbox200'​ section]</​float>​
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 +<​clear/>​
 +\\ \\ 
 +**Syntax**
 +<​code>​
 +<float rightbox200>​[The '​rightbox200'​ section]</​float>​
 +<float leftbox200>​[The '​leftbox200'​ section]</​float>​
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 + -- This line is **not** floating. ​ --\\ 
 +<​clear/>​
 +</​code>​
 +
 +
 +
 +=====Example2. Icon box=====
 +Some style sheet hacks can make icon boxes like these.
 +
 +<float icon(compass)>​
 +You can make a box displaying icon at left side by using '​compass',​ '​wkpedia'​ and '​plugin'​. You can add to icons by adding icon image to float/img/ directory and modifying around the end of style sheet in style.css.
 +
 +This box is created by using %%<float icon(compass)>​%%.
 +</​float>​
 +<float plugin>
 +  *%%<​float plugin>​%%
 +</​float>​
 +<float wkpedia>
 +For reference to Wikipedia.
 +  *%%<​float wkpedia>​%%
 +</​float>​
 +<​clear/>​
 +
 +
 +
 +
 +
 +
 +
 +
 +=====Download=====
 +  *2008-03-23 {{computer:​source:​float.zip?​cache=nocache|float.zip}} (39KB)
 +
 +This ZIP file includes the '​syntax.php',​ '​style.css'​ and image files in the '​float'​ folder.\\ ​
 +Put the '​float'​ folder in the lib/plugin directory of your DokuWiki.
 +
 +
 +
 +
 +=====Links=====
 +  *[[http://​wiki.splitbrain.org/​plugin%3Aboxes|Boxes plugin by Christopher Smith]]
 +  *Symplus'​ [[DokuWiki plugin]]
 +    *[[Clear plugin]]
 +
 +======History======
 +  *2008-03-23 Icon boxes were added.
 +  *2007-10-16 first version uploaded.
 +{{tag>​Plugin}}