模板:TextHover

模板文档  

这个文档嵌入自模板:TextHover/doc。

这是一个专门为大段文字提供Hover效果的模板，基于{{Hovers}}制作。

使用方法

{{TextHover|1=Hover前的文字|2=Hover后的文字|3=如果Hover前的文字较长，这里填before；反之填after；相同长度时可以留空|4=文字水平对齐方向|class=Hover效果|tag=如果强烈希望使用inline模式融入一段文字中，这里填span，否则留空即可}}

尽管这个模板不是为图片Hover设计的，但在某些场合也有助于同时实现桌面版的文字环绕图片效果和移动版的文字、图片分离效果。使用方法为：

{{TextHover|1=Hover前的图片名（内链）|2=Hover后的图片名（内链）|3=如果Hover前的图片较大（指定width参数时需考虑伸缩后的大小，即长宽比），这里填before；反之填after；相同大小时可以留空|4=pic|width=宽度|float=float方向，可省略|margin=桌面版与周围文字的水平间距，默认为0.5em|class=Hover效果}}

如果参数1至4中有任一个是html标记，谨慎起见请务必使用命名参数的写法。

示例

表格内居中

{|border=1 style="float: right; width: 260px; font-size: 90%; margin: 1em 0 1em 1em; background: #f9f9f9; border: 1px #999999 solid; border-collapse: collapse; clear: right;" cellpadding="2" cellspacing="0"
| colspan="2" |[[file:nisecyugokugo.jpg|250px]]
|-
| colspan=2 bgcolor="#E0FFFF" |'''{{TextHover|{{lj|基本情報}}|基本资料||center}}'''
|-
! width=80px|{{TextHover|{{lj|用語名}}|用语名称|after|center}}
| {{TextHover|{{lj|偽中国語}}|伪中国语||center}}
|-
!{{TextHover|{{lj|用語出典}}|用语出处||center}}
| {{TextHover|{{lj|日本国際電子通信網}}|日本网络||center}}
|-
!{{TextHover|{{lj|関連記事}}|相关条目||center}}
| {{TextHover|{{lj|[[中文十級]]、[[君日本語本当上手]]}}|[[中文十級]]、[[君日本語本当上手]]||center}}
|}

<div class="hover-change-before" style=";">基本情報 <div class="hover-change-after" style=";">基本资料
用語名 用语名称	<div class="hover-change-before" style=";">偽中国語 <div class="hover-change-after" style=";">伪中国语
<div class="hover-change-before" style=";">用語出典 <div class="hover-change-after" style=";">用语出处	<div class="hover-change-before" style=";">日本国際電子通信網 <div class="hover-change-after" style=";">日本网络
<div class="hover-change-before" style=";">関連記事 <div class="hover-change-after" style=";">相关条目	<div class="hover-change-before" style=";">中文十級、君日本語本当上手 <div class="hover-change-after" style=";">中文十級、君日本語本当上手

段落左对齐（默认）

{{TextHover|{{lj|内容大体初心者日常的出来事及文句、中級者出鱈目話、上級者偽中国語詩程作文可能（実際中国人可能性有）。}}|内容大体上来说新手都是一些日常的事情或抱怨，中级者则为一些瞎编的故事，厉害的人甚至可以拿伪中国语作诗（实际上有可能是中国人）。|after}}

内容大体初心者日常的出来事及文句、中級者出鱈目話、上級者偽中国語詩程作文可能（実際中国人可能性有）。

内容大体上来说新手都是一些日常的事情或抱怨，中级者则为一些瞎编的故事，厉害的人甚至可以拿伪中国语作诗（实际上有可能是中国人）。

图片

{{textHover|ｲﾝﾄﾞｱ少女 望月杏奈.jpg|Greemas ﾋﾞﾋﾞｯとｱｲﾄﾞﾙ! 望月杏奈.jpg||pic|width=250px|label=「vivid_rabbit」|float=right}}
十分热衷于玩电子游戏，似乎在网络游戏世界是个知名玩家，拥有全世界只有7件的装备之一。

如果身边没有电脑的话就会玩自己的游戏机，没有游戏机的话则会玩手机。在GreeMas卡面和剧情中常能看到杏奈对P撒娇，或要求P和她一起玩游戏。

从GreeMas的卡面和MLTD的特殊动作来看，杏奈可能至少拥有PSP、PSV、PS4和NS等游戏机。

在某款网游中所使用的ID是「'''vivid_rabbit'''」。在该游戏中，杏奈曾与一位ID为「'''lilyknight'''」的人携手干掉了boss。后来在线下见面会中（MLTD设定为组合「少女风暴！」的活动剧情中）杏奈得知「'''lilyknight'''」正是百合子，这也是两人成为好朋友的契机之一。

双海亚美与双海真美姐妹也会和两人一起玩游戏，四人被称为「{{Ruby|765Pro游戏部|{{lj|765プロゲーム部}}}}」。

「vivid_rabbit」

「vivid_rabbit」

十分热衷于玩电子游戏，似乎在网络游戏世界是个知名玩家，拥有全世界只有7件的装备之一。

如果身边没有电脑的话就会玩自己的游戏机，没有游戏机的话则会玩手机。在GreeMas卡面和剧情中常能看到杏奈对P撒娇，或要求P和她一起玩游戏。

从GreeMas的卡面和MLTD的特殊动作来看，杏奈可能至少拥有PSP、PSV、PS4和NS等游戏机。

在某款网游中所使用的ID是「vivid_rabbit」。在该游戏中，杏奈曾与一位ID为「lilyknight」的人携手干掉了boss。后来在线下见面会中（MLTD设定为组合「少女风暴！」的活动剧情中）杏奈得知「lilyknight」正是百合子，这也是两人成为好朋友的契机之一。

双海亚美与双海真美姐妹也会和两人一起玩游戏，四人被称为「765Pro游戏部（765プロゲーム部）」。

已知问题

需要使用行内模式（包括Wikitext的有序和无序列表）时，务必要加上tag=span。

参见

1. 如果想要更为稳定的排版效果，可以考虑基于display:none的{{Moe-hover}}，但此时不能设置transition属性。<span class="hover-change-before" style=";"><span class="hover-change-after" style=";">使用{{Moe-hover}}时，如果Hover前后文字长度不同，页面可能瞬间伸长/缩短。
2. {{Hovers}}拥有丰富的Hover效果，请参考该模板的说明文档设置本模板的class、classb和classa参数。<span class="hover-change-before" style=";"><span class="hover-change-after" style=";">默认效果为基于opacity的淡入淡出。