Template:Hover: Difference between revisions
Jump to navigation
Jump to search
No edit summary |
m (Protected "Template:Hover" ([Edit=Allow only administrators] (indefinite) [Move=Allow only administrators] (indefinite))) |
||
(13 intermediate revisions by the same user not shown) | |||
Line 1: | Line 1: | ||
<includeonly><div class="hoverbox"> | <includeonly><div {{#if:{{{OVERLAY|}}}|style="position:relative;" class="hoverbox"|class="hoverbox"}}><div {{#if:{{{OVERLAY|}}}|style="position:absolute;z-index:3;margin: 0 auto; left: 0; right: 0;" class="hoveritem"|class="hoveritem selected"}}{{#if:{{{style|}}}|style="{{{style}}}" |}}>[[Image:{{{1}}}{{#if:{{{link|}}}|{{!}}link={{{link}}}}}{{#if:{{{alt|}}}|{{!}}alt={{{alt}}}}}{{#if:{{{10|}}}|{{!}}{{{10}}}}}{{#if:{{{9|}}}|{{!}}{{{9}}}}}{{#if:{{{8|}}}|{{!}}{{{8}}}}}{{#if:{{{7|}}}|{{!}}{{{7}}}}}{{#if:{{{6|}}}|{{!}}{{{6}}}}}{{#if:{{{5|}}}|{{!}}{{{5}}}}}{{#if:{{{4|}}}|{{!}}{{{4}}}}}{{#if:{{{3|}}}|{{!}}{{{3}}}}}]]</div><div {{#if:{{{OVERLAY|}}}|style="position:relative;z-index:1"|class="hoveritem"}}{{#if:{{{style|}}}|style="{{{style}}}"|}}>[[Image:{{{2}}}{{#if:{{{link|}}}|{{!}}link={{{link}}}}}{{#if:{{{alt|}}}|{{!}}alt={{{alt}}}}}{{#if:{{{3|}}}|{{!}}{{{3}}}}}{{#if:{{{4|}}}|{{!}}{{{4}}}}}{{#if:{{{5|}}}|{{!}}{{{5}}}}}{{#if:{{{6|}}}|{{!}}{{{6}}}}}{{#if:{{{7|}}}|{{!}}{{{7}}}}}{{#if:{{{8|}}}|{{!}}{{{8}}}}}{{#if:{{{9|}}}|{{!}}{{{9}}}}}{{#if:{{{10|}}}|{{!}}{{{10}}}}}]]</div></div></includeonly><noinclude>This template displays a default image, then substitutes another image when the reader hovers over it (e.g. if visual users place their mouse over the image). Works best when the images are the same size, but they don't have to be. | ||
<div {{#if:{{{style|}}}|style="{{{style}}}" |}} | |||
[[Image:{{{1}}}{{#if:{{{link|}}}|{{!}}link={{{link}}}}}{{#if:{{{alt|}}}|{{!}}alt={{{alt}}}}}{{#if:{{{10|}}}|{{!}}{{{10}}}}}{{#if:{{{9|}}}|{{!}}{{{9}}}}}{{#if:{{{8|}}}|{{!}}{{{8}}}}}{{#if:{{{7|}}}|{{!}}{{{7}}}}}{{#if:{{{6|}}}|{{!}}{{{6}}}}}{{#if:{{{5|}}}|{{!}}{{{5}}}}}{{#if:{{{4|}}}|{{!}}{{{4}}}}}{{#if:{{{3|}}}|{{!}}{{{3}}}}}]] | <pre>{{hover|Roster-blank.jpg|Roster-rahman.jpg}}</pre> | ||
</div> | |||
<div {{#if:{{{style|}}}|style="{{{style}}}" | {{hover|Roster-blank.jpg|Roster-rahman.jpg}} | ||
[[Image:{{{2}}}{{#if:{{{link|}}}|{{!}}link={{{link}}}}}{{#if:{{{alt|}}}|{{!}}alt={{{alt}}}}}{{#if:{{{3|}}}|{{!}}{{{3}}}}}{{#if:{{{4|}}}|{{!}}{{{4}}}}}{{#if:{{{5|}}}|{{!}}{{{5}}}}}{{#if:{{{6|}}}|{{!}}{{{6}}}}}{{#if:{{{7|}}}|{{!}}{{{7}}}}}{{#if:{{{8|}}}|{{!}}{{{8}}}}}{{#if:{{{9|}}}|{{!}}{{{9}}}}}{{#if:{{{10|}}}|{{!}}{{{10}}}}}]] | |||
</div> | (Place pointer over image to see effect.) | ||
</div></includeonly><noinclude>This template displays a default image, then substitutes another image when the reader hovers over it (e.g. if visual users place their mouse over the image). | |||
==Additional Options== | |||
Usual image options are supported (link=, custom pixel width or height, alt text, etc.). Just separate each additional option with a pipe character like you would normally. | |||
===Link=== | |||
<pre>{{hover|Roster-blank.jpg|Roster-rahman.jpg|link=Roshanara Rahman}}</pre> | |||
{{hover|Roster-blank.jpg|Roster-rahman.jpg|link=Roshanara Rahman}} | |||
===Width=== | |||
<pre>{{hover|Roster-blank.jpg|Roster-rahman.jpg|60px|link=Roshanara Rahman}}</pre> | |||
{{hover|Roster-blank.jpg|Roster-rahman.jpg|60px|link=Roshanara Rahman}} | |||
===Overlay=== | |||
You can also have the first image appear as an overlay over the second image by adding OVERLAY=Yes to your wiki code. | |||
<pre>{{hover|Awards-glass.png|Awards-dutypost.jpg|OVERLAY=Yes|link=duty post award}}</pre> | |||
{{hover|Awards-glass.png|Awards-dutypost.jpg|OVERLAY=Yes|link=duty post award}} | |||
==Questions/Comments== | |||
[[User:Rich|'''♫ Rich''']] ([[User_talk:Rich|talk]]) | |||
[[Category:Templates]]</noinclude> | [[Category:Templates]]</noinclude> |
Latest revision as of 20:25, 30 April 2016
This template displays a default image, then substitutes another image when the reader hovers over it (e.g. if visual users place their mouse over the image). Works best when the images are the same size, but they don't have to be.
{{hover|Roster-blank.jpg|Roster-rahman.jpg}}
(Place pointer over image to see effect.)
Additional Options
Usual image options are supported (link=, custom pixel width or height, alt text, etc.). Just separate each additional option with a pipe character like you would normally.
Link
{{hover|Roster-blank.jpg|Roster-rahman.jpg|link=Roshanara Rahman}}
Width
{{hover|Roster-blank.jpg|Roster-rahman.jpg|60px|link=Roshanara Rahman}}
Overlay
You can also have the first image appear as an overlay over the second image by adding OVERLAY=Yes to your wiki code.
{{hover|Awards-glass.png|Awards-dutypost.jpg|OVERLAY=Yes|link=duty post award}}