Template:Overfloat image/sandbox
 | This is the template sandbox page for Template:Overfloat image (diff). See also the companion subpage for test cases. |
 | This template uses Lua: |
 | This template uses TemplateStyles: |
Overfloats items on one image. For example, text captions may be floated over the white-space in an image.
Usage
[edit]The letters 'px' are hard-coded in the template. Use digits only and omit 'px'.
{{overfloat image
| image =
| width =
| item1 =
| hpos1 =
| vpos1 =
| x1 =
| y1 =
| width1 =
| height1=
| border1=
| ts1 =
| item2 =
| hpos2 =
| vpos2 =
| x2 =
| y2 =
| width2 =
| height2=
| border2=
| ts2 =
...
}}
Parameters
[edit]- image: The image and all related code. Should include the
[[File:...]]elements. - width: (Optional) The width (in pixels) of the div in which to place the image and overfloated items. Should be equal or above the size of the image. Defaults to 400.
- itemi: The item to be overfloated. If text, the templates {{block left}}, {{block center}} or {{block right}} are useful.
- hposi: (Optional) Sets the horizontal edge position of the item to either left or right. Defaults to left.
- vposi: (Optional) Sets the vertical edge position of the item to either top or bottom. Defaults to top.
- xi: (Optional) Sets the size of the margin of the horizontal position. Defaults to 0.
- yi: (Optional) Sets the size of the margin of the vertical position. Defaults to 0.
- widthi: (Optional) Sets the horizontal size of item block. No default.
- heighti: (Optional) Sets the vertical size of item block. No default.
- borderi: (Optional) Sets the border style of item block (debugging aid). No border by default.
- tsi: (Optional) If set, render item block in a table cell, which is passed a single {{ts}} directive. Useful values are currently "top", "middle" or "bottom" to select vertical alignment style. No table cell by default.
The numbered parameters are only used if the corresponding item is used. For example, x2 and y2 are only used if item2 is used.
Examples
[edit]Example 1: The Facts in the Case of M. Valdemar
[edit]{{overfloat image
| image = [[File:Amazing Stories v01n01 p092 The Facts in the Case of M Valdemar.png|400px|center]]
| item1 = {{block left
|width=400
|{{gap}}{{x-larger|''The''}} {{xx-larger|{{sc|'''Facts'''}}}}<br />{{x-larger|''in the''}} {{xx-larger|{{sc|'''Case'''}}}} {{x-larger|''of''}}<br />{{xx-larger|{{sc|'''M. Valdemar'''}}}}
{{c|{{larger|''by''}}}}
{{larger|''Edgar Allan Poe''}}
}}
| y1 = 50
}}
The Facts
in the Case of
M. Valdemar
in the Case of
M. Valdemar
by
Edgar Allan Poe
Example 2: The Trail of the Cloven Hoof
[edit]{{overfloat image
| image = [[File:WeirdTalesv24n3pg352 Trail of the Cloven Hoof.png|center|600px]]
| width = 600
| item1 = {{block center|width=150px|{{larger|By ARLTON EADIE}}}}
| x1 = 230
| y1 = 0
| item2 = {{block right|width=175px|{{smaller|"One look was enough. I snapped off my flashlight and fled."}}}}
| hpos2 = right
| y2 = 425
}}
By ARLTON EADIE
"One look was enough. I snapped off my flashlight and fled."
Example 3: The Pathway of Roses
[edit]Notes
[edit]- This example shows how to dynamically vertical centre a text block within a frame.
{{overfloat image
| image = [[File:The Pathway of Roses, Larson (1913) decoration on page 5.jpg|frameless|center|400px]]
| item1 = <div style="line-height:1.5; text-indent:1em; margin-left:0; font-style:italic;
font-size:92%; text-align:justify;"><div>''To give the world emancipation is the ruling desire of all<!--
--> minds that are spiritually awakened; and these should remember that to overcome evil with good is the only way.<!--
--> Forget the wrong that may appear in the outer world of things, and give all your thought to the great good that is<!--
--> inherent in all things. You thereby place in action the greatest emancipating power that the human race will ever<!--
--> know.''</div>
<div>''We are in bondage because we have lived to please the person. Follow the soul and freedom shall come quickly.<!--
--> Then we shall please the person better than ever before. To follow the soul is to enter the greater domains of life,<!--
--> those domains from which we may secure everything that is rich and beautiful and superior in human existence. The<!--
--> soul leads, not only into the life more abundant, but also into the actual possession of all the spiritual riches<!--
--> that the greater life may contain. And when we find the kingdom that is within, all that we may desire in the<!--
--> without shall be added.''</div>
<div>''The soul that lives most perfectly in the present, creates most nobly for the future. Be yourself to-day,<!--
--> regardless of what happened yesterday. Be all that you are or can be to-day, and you will live in a fairer world<!--
--> to-morrow.''</div></div>
| x1 = 50
| y1 = 50
| height1 = 553
| width1 = 300
| ts1 = middle
}}
_decoration_on_page_5.jpg)
To give the world emancipation is the ruling desire of all minds that are spiritually awakened; and these should remember that to overcome evil with good is the only way. Forget the wrong that may appear in the outer world of things, and give all your thought to the great good that is inherent in all things. You thereby place in action the greatest emancipating power that the human race will ever know.
We are in bondage because we have lived to please the person. Follow the soul and freedom shall come quickly. Then we shall please the person better than ever before. To follow the soul is to enter the greater domains of life, those domains from which we may secure everything that is rich and beautiful and superior in human existence. The soul leads, not only into the life more abundant, but also into the actual possession of all the spiritual riches that the greater life may contain. And when we find the kingdom that is within, all that we may desire in the without shall be added.
The soul that lives most perfectly in the present, creates most nobly for the future. Be yourself to-day, regardless of what happened yesterday. Be all that you are or can be to-day, and you will live in a fairer world to-morrow. |