|
<noinclude>{{doc|content=用於[[LoveLive!學園偶像祭ALL STARS歌曲列表]]，請使用{{tl|AS song select}}調用。}}</noinclude><includeonly><!--{if !isset($wgWidgetAsSong) || !$wgWidgetAsSong}--><!--{assign var="wgWidgetAsSong" value=true scope="global"}--><script>[[category:混合小部件]]
<p>JavaScript脚本：[[User:Bhsd/widget/as-song.js]]</p></noinclude><includeonly><!--{if !isset($wgWidgetAsSong) || !$wgWidgetAsSong}--><!--{assign var="wgWidgetAsSong" value=true scope="global"}--><script defer src="/zh?title=user:bhsd/widget/as-song.js&action=raw&ctype=text/javascript"></script><style>
//</includeonly>JavaScript脚本：<pre lang=js>
window.addEventListener('load', function() {
document.querySelectorAll( '.as-song-container' ).forEach(function(ele) {
var select = document.createElement('select'),
nodeList = ele.querySelectorAll('.as-song');
ele.insertBefore(select, ele.firstChild);
select.lang = 'ja';
select.dataset.oldIndex = 0;
nodeList[0].style.display = 'table';
nodeList.forEach(function(table) {
var option = new Option(table.querySelector('big').textContent);
select.add(option);
});
select.onchange = function() {
nodeList[select.dataset.oldIndex].style.display = 'none';
nodeList[select.selectedIndex].style.display = 'table';
select.dataset.oldIndex = select.selectedIndex;
};
});
});
//</pre>
<includeonly>
</script><style>
/* </includeonly>CSS样式表：<pre lang=css> */
.as-song-container select.oo-ui-comboBoxInputWidget {
width: 500px; /* 完整显示现最长的歌曲名称 */
font-size: 1rem;
paddingmax-width: 2px100%;
margin-right: 1em0;
}
.as-song-container select + div.oo-ui-menuOptionWidget {
padding-left: 0.85714286em;
vertical-align: top;
}
.as-song-container .as-song> div {
display: inline-block; /* 居中 */
}
.as-song-container .as-song, .as-song .zh, .as-song .en {
display: none;
}
|