LLWiki正在建设中,欢迎加入我们

“Widget:As-song”的版本间差异

来自LLWiki
跳转到导航 跳转到搜索
标签移动版网页编辑 移动版编辑
(//使用页面/文本对比查看器快速编辑)
 
(未显示同一用户的27个中间版本)
第1行: 第1行:
<noinclude>{{doc|content=用於[[LoveLive!學園偶像祭ALL STARS歌曲列表]],請使用{{tl|AS song select}}調用。}}</noinclude><includeonly><!--{if !isset($wgWidgetAsSong) || !$wgWidgetAsSong}--><!--{assign var="wgWidgetAsSong" value=true scope="global"}--><script>
<noinclude>{{doc|content=用於[[LoveLive!學園偶像祭ALL STARS歌曲列表]],請使用{{tl|AS song select}}調用。}}[[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'),
optionArray = [];
ele.insertBefore(select, ele.firstChild);
select.lang = 'ja';
nodeList.forEach(function(table, i) {
var option = new Option(table.querySelector('big').textContent, i);
optionArray.push(option);
});
optionArray = optionArray.sort(function(a, b) {
return a.text <= b.text ? -1 : 1;
});
optionArray.forEach(function(option) {
select.add(option);
});
select.dataset.oldIndex = optionArray[0].value;
nodeList[select.dataset.oldIndex].style.display = 'table';
select.onchange = function() {
nodeList[select.dataset.oldIndex].style.display = 'none';
select.dataset.oldIndex = optionArray[select.selectedIndex].value;
let currentNode = nodeList[select.dataset.oldIndex];
currentNode.style.display = 'table';
currentNode.querySelectorAll( '.lazy-image-placeholder' ).forEach(function(e) {
let img = document.createElement('img');
img.src = e.dataset.src;
e.replaceWith(img);
});
};
});
});
//</pre>
<includeonly>
</script><style>
/* </includeonly>CSS样式表:<pre lang=css> */
/* </includeonly>CSS样式表:<pre lang=css> */
.as-song-container select {
.as-song-container .oo-ui-comboBoxInputWidget {
width: 500px; /* 完整显示现最长的歌曲名称 */
font-size: 1rem;
padding: 2px;
max-width: 100%;
margin-right: 1em;
margin-right: 0;
display: block;
font-family: 'ヒラギノ角ゴ ProN' , 'Hiragino Kaku Gothic ProN' , '游ゴシック' , '游ゴシック体' , YuGothic , 'Yu Gothic' , 'メイリオ' , Meiryo , 'MS ゴシック' , 'MS Gothic' , HiraKakuProN-W3 , 'TakaoExゴシック' , TakaoExGothic , 'MotoyaLCedar' , 'Droid Sans Japanese' , sans-serif;
}
}
.as-song-container select + div {
.as-song-container .oo-ui-menuOptionWidget {
padding-left: 0.85714286em;
display: inline-block;
vertical-align: top;
}
}
.as-song-container .as-song {
.as-song-container > div {
display: inline-block; /* 居中 */
}
.as-song-container .as-song, .as-song .zh, .as-song .en {
display: none;
display: none;
}
}

2022年5月17日 (二) 20:01的最新版本

Template-info.png 小部件文档
这个文档是内联文档。

用于LoveLive!学园偶像祭ALL STARS歌曲列表,请使用{{AS song select}}调用。

JavaScript脚本:User:Bhsd/widget/as-song.js

CSS样式表:

 */
.as-song-container .oo-ui-comboBoxInputWidget {
	width: 500px; /* 完整显示现最长的歌曲名称 */
	max-width: 100%;
	margin-right: 0;
	display: block;
}
.as-song-container .oo-ui-menuOptionWidget {
	padding-left: 0.85714286em;
}
.as-song-container > div {
	display: inline-block; /* 居中 */
}
.as-song-container .as-song, .as-song .zh, .as-song .en {
	display: none;
}
/*