This site is supported by donations to The OEIS Foundation.
Template:Translate
From OeisWiki
The following documentation is located at Template:Translate/doc. [<Edit> Template:Translate/doc]
[⧼Purge⧽ Template:Translate]
[⧼Purge⧽ Template:Translate]
The {{translate}} graphic template translates an element (text, table, image, ...) by offset x, y with unit unit.
Contents
Usage
- {{translate|element to translate|offset = x, y|unit = unit|origin = x, y|origin unit = origin unit}}
or (default origin unit is %)
- {{translate|element to translate|offset = x, y|unit = unit|origin = x, y}}
or (default origin is 50, 50)
- {{translate|element to translate|offset = x, y|unit = unit}}
or (default unit is px, center of bounding box of the element is used as reference for translation)
- {{translate|element to translate|offset = x, y}}
or (default unit is px, center of bounding box of the element is used as reference for translation)
- {{translate|element to translate|x, y}}
or (default offset is 0, 0, i.e. no translation)
- {{translate|element to translate}}
Valid input
- offset: offset x, y (default 0, 0, i.e. no translation);
- unit: % or px or pt or pc or em or ex (default px).
- origin: x, y (default 50, 50)
- origin unit: (default %)
By default, center of bounding box of the element is used as reference for translation.
Examples
Examples with valid input
{| align="center" style="text-align: center;" |- | <div style="position: relative; width: 100px; height: 100px; background: #f9f9f9; border: 1px solid darkgray; border-radius: 50%;"><!-- 3 6 9 12 --><span style="color: #777; background: #f9f9f9;"><!-- -->{{translate|'''III'''|90 - 4, 50 - 10|unit = px}}<!-- -->{{translate|'''VI '''|50 - 6, 8 - 10|unit = px}}<!-- -->{{translate|'''IX '''|10 - 6, 50 - 10|unit = px}}<!-- -->{{translate|'''XII'''|50 - 8, 90 - 10|unit = px}}<!-- Hour and minute needles -->{{translate| {{rotate| {{line|length = 35|color = #777}} | 90 - ( {{#explode:{{LOCALTIME}}|:|0}} ) * 360 / 12 - ( {{#explode:{{LOCALTIME}}|:|1}} ) * 360.0 / 720 }} |50, 50|unit = px}}<!-- -->{{translate| {{rotate| {{line|length = 45|color = #777}} | 90 - ( {{#explode:{{LOCALTIME}}|:|1}} ) * 360 / 60 }} |50, 50|unit = px}}<!-- Hub -->{{translate|•|50 - 2, 50 - 9|unit = px}}<!-- --></span><!-- --></div> '''{{LOCALTIME}}''' |- |}
yields
IIIVI IX XII •
11:58 |
CSS Transforms
Cf. Help:CSS Transforms#CSS Translation.
Code
See also
Drawing templates
- {{Canvas}}
- {{Square}}
- {{Round square}} ({{rounded corners square}})
- {{Rect}} ({{rectangle}})
- {{Round rect}} ({{rounded corners rectangle}})
- {{Polyline}}
- {{Polygon}} ({{closed polyline}})
- {{Regular polygon}}
Affine transforms templates
See Help:CSS Transforms.
- {{Origin}}
- {{Translate}} and {{transform-translate}}
- {{Flip}}
- {{Scale}} and {{transform-scale}}
- {{Rotate}} and {{transform-rotate}}
- {{SkewX}}
- {{SkewY}}
- {{Skew}} and {{transform-skew}}
- {{Affine}} ({{affine matrix}})