Template:Superimpose: Difference between revisions
From HorizonXI Wiki
(Created page with "<div style="position: relative; width: {{{base_width}}};{{#switch:{{{align|}}}|left=float:left; clear:left;|right=float:right; clear:right;|center=margin-left:auto; margin-right:auto;|#default=}}">{{ #if: {{{x|}}} | <div style="position: absolute; left: {{{x|0}}}px; top: {{{y|0}}}px; padding: 0;"><!-- -->[[Image:{{{float}}}|{{{float_width}}}{{#ifeq:{{{float_link|}}}|file:||{{!}}link={{{float_link|}}}}}|alt={{{float_alt|}}}|{{{float_caption|}}}]]</div>}}Image:...") |
m (→Usage: updated example numbers) |
||
(5 intermediate revisions by 3 users not shown) | |||
Line 1: | Line 1: | ||
<div style="position: | <includeonly>{{#if: {{{base}}} | | ||
#if: {{{ | <div style="position: absolute; width: {{{base_width}}}; left=float:left; clear:left; right=float:right; clear:right; center=margin-left:auto; margin-right:auto;"><!-- | ||
-->[[Image:{{{base}}}|{{{base_width}}}]]}} | |||
-->[[Image:{{{float}}}|{{{float_width}}} | {{#if: {{{float}}}| | ||
<center><div style="position: absolute; left: {{{x|0}}}px; top: {{{y|0}}}px; padding: 0; width:{{{float_width}}}"><!-- | |||
-->[[Image:{{{float}}}|{{{float_width}}}]]}}</div></center></div> | |||
</includeonly> | |||
<noinclude> | |||
== Superimpose Template == | |||
The "Superimpose" template allows you to overlay an image (called "float") on top of another image (called "base") using absolute positioning. Primary use is to display an image (like a weapon graphic) over it's background border. | |||
=== Usage === | |||
To use the "Superimpose" template, follow this syntax: | |||
<pre> | |||
<nowiki>{{</nowiki>Superimpose | |||
| base = Base_image.png | |||
| base_width = width_of_base_image (i.e. 32px) | |||
| float = Float_image.png | |||
| float_width = width_of_float_image (i.e. 26px) | |||
| x = horizontal_position (optional, defaults to 0) | |||
| y = vertical_position (optional, defaults to 0) | |||
<nowiki>}}</nowiki> | |||
</pre> | |||
=== Parameters === | |||
* `base`: The filename or file path of the base image that you want to display. | |||
* `base_width`: The width of the base image in pixels (e.g., "32px"). | |||
* `float`: The filename or file path of the image that you want to float on top of the base image. | |||
* `float_width`: The width of the float image in pixels (e.g., "26px"). | |||
* `x`: The horizontal position of the float image relative to the top-left corner of the base image (optional, defaults to 0). | |||
* `y`: The vertical position of the float image relative to the top-left corner of the base image (optional, defaults to 0). | |||
===Examples=== | |||
{|border="1" | |||
|- BGCOLOR="e3e3e3" | |||
! Code !! Images || Result | |||
|- | |||
|<pre style="white-space:pre-line"> | |||
{{Superimpose | |||
| base = Icon_background.png | |||
| base_width = 32px | |||
| float = Changes.png | |||
| float_width = 26px | |||
| x = 4 | |||
| y = 4 | |||
}} | |||
</pre> | |||
| <div style = "padding: 0px 30px 0px 10px;"> | |||
* '''base image''' https://horizonffxi.wiki/w/images/4/41/Icon_background.png | |||
* '''float image''' {{changes}} </div> | |||
| <div style = "padding: 0px 60px 0px 30px;"> | |||
{{Superimpose | |||
| base = Icon_background.png | |||
| base_width = 32px | |||
| float = Changes.png | |||
| float_width = 26px | |||
| x = 4 | |||
| y = 4 | |||
}} </div> | |||
</noinclude> | |||
__NOTOC__ |
Latest revision as of 21:24, 17 March 2024
Superimpose Template
The "Superimpose" template allows you to overlay an image (called "float") on top of another image (called "base") using absolute positioning. Primary use is to display an image (like a weapon graphic) over it's background border.
Usage
To use the "Superimpose" template, follow this syntax:
{{Superimpose | base = Base_image.png | base_width = width_of_base_image (i.e. 32px) | float = Float_image.png | float_width = width_of_float_image (i.e. 26px) | x = horizontal_position (optional, defaults to 0) | y = vertical_position (optional, defaults to 0) }}
Parameters
- `base`: The filename or file path of the base image that you want to display.
- `base_width`: The width of the base image in pixels (e.g., "32px").
- `float`: The filename or file path of the image that you want to float on top of the base image.
- `float_width`: The width of the float image in pixels (e.g., "26px").
- `x`: The horizontal position of the float image relative to the top-left corner of the base image (optional, defaults to 0).
- `y`: The vertical position of the float image relative to the top-left corner of the base image (optional, defaults to 0).
Examples
Code | Images | Result |
---|---|---|
{{Superimpose | base = Icon_background.png | base_width = 32px | float = Changes.png | float_width = 26px | x = 4 | y = 4 }} |
|
|