LLWiki正在建设中,欢迎加入我们!
“Widget:Songposition”的版本间差异
跳转到导航
跳转到搜索
小 |
小 |
||
第1行: | 第1行: | ||
<noinclude>{{doc|content=用于{{tl|songposition}}的样式表。}}</noinclude><includeonly><!--{if !isset($wgWidgetSongposition) || !$wgWidgetSongposition}--><!--{assign var="wgWidgetSongposition" value=true scope="global"}--> |
<noinclude>{{doc|content=用于{{tl|songposition}}的样式表。}}</noinclude><includeonly><!--{if !isset($wgWidgetSongposition) || !$wgWidgetSongposition}--><!--{assign var="wgWidgetSongposition" value=true scope="global"}--><script> |
||
// </includeonly>JavaScript脚本:<pre lang="js"> |
|||
⚫ | |||
window.addEventListener('load', function () { |
|||
document.querySelectorAll( '.member-symbol' ).forEach(function(ele) { |
|||
ele.dataset.title = ele.title; |
|||
ele.removeAttribute('title'); |
|||
}); |
|||
}); |
|||
// </pre> |
|||
⚫ | |||
⚫ | |||
/* </includeonly>CSS样式表:<pre lang="css"> */ |
/* </includeonly>CSS样式表:<pre lang="css"> */ |
||
.member-symbol { |
.member-symbol { |
||
第6行: | 第15行: | ||
position: relative; |
position: relative; |
||
} |
} |
||
.member-symbol:hover::after { |
|||
content: attr(title); |
content: attr(data-title); |
||
position: absolute; |
position: absolute; |
||
white-space: nowrap; |
white-space: nowrap; |
||
第25行: | 第34行: | ||
} |
} |
||
/* </pre><includeonly> */ |
/* </pre><includeonly> */ |
||
</style> |
</style><!--{/if}--></includeonly> |
||
⚫ |
2020年10月3日 (六) 05:22的版本
JavaScript脚本:
window.addEventListener('load', function () {
document.querySelectorAll( '.member-symbol' ).forEach(function(ele) {
ele.dataset.title = ele.title;
ele.removeAttribute('title');
});
});
//
CSS样式表:
*/
.member-symbol {
display: inline-block;
position: relative;
}
.member-symbol:hover::after {
content: attr(data-title);
position: absolute;
white-space: nowrap;
top: 100%;
left: 50%;
transform: translateX(-50%);
border: 1px solid #a7d7f9;
z-index: 10;
background-color: #fff;
padding: 0 3px;
border-radius: 4px;
box-shadow: 1px 1px 1px #ccc;
}
.member-symbol img {
width: 20px;
height: auto;
}
/*