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
Shironsaki (talk | contribs) No edit summary |
No edit summary Tag: Manual revert |
||
| (29 intermediate revisions by 5 users not shown) | |||
| Line 1: | Line 1: | ||
<table style="display: block; {{#if:{{{style|}}}|{{{style}}}}}"> | <includeonly>{{#css: | ||
<tr> | .fadeout-container:hover .fadeout { | ||
<span class="fadeout" style="position: absolute; width: {{{width|}}}"> | z-index: initial!important; | ||
[[File:{{{image-up| | } | ||
</span> | }}<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 class="fadein" style="width: {{{width|}}}"> | |||
[[File:{{{image-down| | |||
</span> | |||
</tr> | |||
</table>< | |||
< | |||
{{ | |||
}} | |||
</ | |||
Latest revision as of 00:21, 24 November 2022
.png){kind=spacer}
{{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.
