Template:Hover/doc：修订间差异
跳到导航
跳到搜索
imported>=海豚= 无编辑摘要 |
imported>=海豚= 小 （文本替换 - 替换“<br>”为“<br/>”） |
||
| （未显示同一用户的1个中间版本） | |||
| 第15行： | 第15行： | ||
| after ||任意 || 现在你看不到 || 设置鼠标放置于其上时显示出的字符等 | | after ||任意 || 现在你看不到 || 设置鼠标放置于其上时显示出的字符等 | ||
|- | |- | ||
| width || rowspan="2" | 否，默认为最大需要的大小 || rowspan="2" | 数字(+单位) || rowspan="2" | 150<br>10em || 设置显示的字符等的宽度，不加单位时默认为px | | width || rowspan="2" | 否，默认为最大需要的大小 || rowspan="2" | 数字(+单位) || rowspan="2" | 150<br/>10em || 设置显示的字符等的宽度，不加单位时默认为px | ||
|- | |- | ||
| height || 设置显示的字符等高度，不加单位时默认为px | | height || 设置显示的字符等高度，不加单位时默认为px | ||
| 第43行： | 第43行： | ||
'''对于图片：'''与{{tl|PicHover}}类似，但是图片需要直接填链接。 | '''对于图片：'''与{{tl|PicHover}}类似，但是图片需要直接填链接。 | ||
<pre> | <pre> | ||
{{Hover|before=[[文件:58185939_1.png|缩略图]]|after=[[文件:58185939_3.png|缩略图]] | {{Hover|before=[[文件:58185939_1.png|缩略图]]|after=[[文件:58185939_3.png|缩略图]]}} | ||
</pre> | </pre> | ||
显示效果： | 显示效果： | ||
{{Hover|before=[[文件:58185939_1.png|缩略图]]|after=[[文件:58185939_3.png|缩略图]] | {{Hover|before=[[文件:58185939_1.png|缩略图]]|after=[[文件:58185939_3.png|缩略图]]}} | ||
'''对于文字：''' | '''对于文字：''' | ||
2021年4月18日 (日) 19:11的最新版本
本模板用于图片以外的hover切换效果（比如文字，css自绘图形），但也可以应用到图片。使用了widget:Hover。
参数与实例[编辑源代码]
一共有十二个参数，其中有两个是必须的。
| 参数名 | 是否必须 | 参数样式 | 参数示例 | 参数作用 |
|---|---|---|---|---|
| before | 是 | 任意 | 你看得到我 | 设置鼠标未放置于其上时显示的字符等 |
| after | 任意 | 现在你看不到 | 设置鼠标放置于其上时显示出的字符等 | |
| width | 否，默认为最大需要的大小 | 数字(+单位) | 150 10em |
设置显示的字符等的宽度，不加单位时默认为px |
| height | 设置显示的字符等高度，不加单位时默认为px | |||
| float | 否，默认为none | left / right | 让hover块浮动起来~ | |
| hp | 否，不指定则不更改任何内容 | relative/absolute/static/fixed | 控制 hover 类的 position 属性 (HoverPositionOverride) | |
| dis | 否，不指定则不更改任何内容 | inline-block/block | 控制 hover 类的 display 属性 (HoverDisplayOverride) | |
| hb | 否，不指定则不更改任何内容 | none/inline-block/block | 控制 hoverbefore 类的 display 属性 (HoverBeforeDisplay) | |
| ha | 否，不指定则不更改任何内容 | none/inline-block/block | 控制 hoverafter 类的 display 属性 (HoverAfterDisplay) | |
| onhb | 否，不指定则不更改任何内容 | none/inline-block/block | 控制 hoverbefore 类的 display 属性 (鼠标放置时) (HoverBeforeDisplayOnHover) | |
| onha | 否，不指定则不更改任何内容 | none/inline-block/block | 控制 hoverafter 类的 display 属性 (鼠标放置时) (HoverAfterDisplayOnHover) | |
备注: 如果使用了参数 onhb 和 onha，则只有鼠标在 hoverbefore 上时 hoverafter 才会出现。
于是完整的代码实例如下：
对于图片：与{{PicHover}}类似，但是图片需要直接填链接。
{{Hover|before=[[文件:58185939_1.png|缩略图]]|after=[[文件:58185939_3.png|缩略图]]}}
显示效果：
对于文字：
{{Hover|before={{color|blue|你看得到我}}|after={{color|red|现在你看不到}}}}
显示效果：
你看得到我
现在你看不到
对于自选图形
与文字类似，字太多影响阅读我就不写了……
显示效果：