查看“模板:歌曲悬浮信息/文档”的源代码

{{左侧目录|开始}}
== 模板说明 ==
# 在手机端会显示“查看详情页面”的按钮。
# 需要安装Gadget Tooltip。
== UI渲染展示 ==
{| class="wikitable broadtable"
|-
! 情况 !! 代码 !! 渲染效果
|-
| 有extra数据 || <pre>{{歌曲悬浮信息|Saika}}</pre> || {{歌曲悬浮信息|Saika}}
|-
| 无extra数据 || <pre>{{歌曲悬浮信息|Dream}}</pre> || {{歌曲悬浮信息|Dream}} 
|-
| 无BPM数据 || <pre>{{歌曲悬浮信息|Deemo Goodbye}}</pre> || {{歌曲悬浮信息|Deemo Goodbye}}
|}
== 使用方法 ==
<pre><span style="position: relative;"><span class="bili-tt" data-type="@歌曲悬浮信息" data-name="{{{标题|}}}@{{{弹窗类型|}}}">鼠标移到这里，手机端点 </span></span></pre>
== 使用示例 ==
{| class="wikitable broadtable"
! 代码 !! 效果
|-
| style="width: 50%" | <pre><span style="position: relative;"><span class="bili-tt" data-type="@歌曲悬浮信息" data-name="Jumpy star@{{{弹窗类型|}}}">{{正方形图片|100px|Jumpy star.png}}</span></span></pre>
| <span style="position: relative;"><span class="bili-tt" data-type="@歌曲悬浮信息" data-name="Jumpy star@{{{弹窗类型|}}}">{{正方形图片|100px|Jumpy star.png}}</span></span>
|-
| style="width: 50%" | <pre><span style="position: relative;"><span class="bili-tt" data-type="@歌曲悬浮信息" data-name="Dream@{{{弹窗类型|}}}">{{正方形图片|100px|Dream.png}}</span></span></pre>
| <span style="position: relative;"><span class="bili-tt" data-type="@歌曲悬浮信息" data-name="Dream@{{{弹窗类型|}}}">{{正方形图片|100px|Dream.png}}</span></span>
|}
{{左侧目录|结束}}