Information: If you want to test this template, please use Sandbox.
This documentation is transcluded from Template:IconHover/doc.
Template:IconHover: Difference between revisions
From Elwiki
mNo edit summary |
No edit summary Tag: Manual revert |
||
(22 intermediate revisions by 2 users not shown) | |||
Line 1: | Line 1: | ||
<table style="display: block-table; {{#if:{{{style|}}}|{{{style}}}}}"> | <includeonly>{{#css: | ||
<tr> | .fadeout-container:hover .fadeout { | ||
<p class="fadeout-container {{#ifeq:{{{hidebottom}}}|true|fadeout-hide-bottom}}"> | z-index: initial!important; | ||
<span class="fadeout" style="position: absolute; width: {{{width|}}}"> | } | ||
[[File:{{{image-up| | }}<div style="position:relative;"><table style="display: block-table; {{#if:{{{style|}}}|{{{style}}}}}"><tr><p class="fadeout-container {{#ifeq:{{{hidebottom}}}|true|fadeout-hide-bottom}}" style="display:inline-block;"><span class="fadeout" style="position: absolute; width: {{{width|}}}">[[File:{{{image-up|Dunno.png}}}|{{{width|54px}}}|link={{#if:{{{link|}}}|{{{link}}}}}{{#if:{{{title|}}}|{{!}}{{{title}}}}}]]</span><span class="fadein" style="width: {{{width|}}}">[[File:{{{image-down|TransShared.png}}}|{{{width|54px}}}]]</span></p></tr></table></div></includeonly><noinclude>{{Doc}}</noinclude> | ||
</span> | |||
<span class="fadein" style="width: {{{width|}}}"> | |||
[[File:{{{image-down| | |||
</span> | |||
</p> | |||
</tr> | |||
</table> | |||
< | |||
< | |||
{{ | |||
}} | |||
</noinclude> |
Latest revision as of 00:21, 24 November 2022
{{IconHover |image-up= |image-down= |width= |link= |title= |style= }}
- image-up: the top image file link.
- image-down: the bottom image file link.
- width: the width of the images. (54px by default)
- link: a link when pressing the button.
- title: a title that will appear when hovering above the button.
- style: extra style for the table.
All of these parameters are optional.
Please note that the sizes of image 1 and image 2 should be the same.
Hide bottom image
In order to hide the bottom image, and only show it when hovering above the top image, add another parameter:
|hidebottom= true
However, it will not be displayed this way in editing mode.