| ◆少前百科是非盈利性、非官方的少女前线维基百科。 ◆如果您发现某些内容错误/空缺，请勇于修正/添加！参与进来其实很容易！点这里 加入少前百科。 ◆有任何意见、建议、纠错，欢迎在 GFwiki:反馈与建议 提出和讨论。编辑事务讨论QQ群：597764980，微博@GFwiki少前百科 ◆To foreigners，You can use twitter to contact us. |
|
“Widget:子页面列表”的版本间的差异
Mikumikuer（讨论 | 贡献） |
Mikumikuer（讨论 | 贡献） |
||
| 第2行： | 第2行： | ||
<link href="https://lib.baomitu.com/font-awesome/5.0.8/web-fonts-with-css/css/fontawesome-all.css" rel="stylesheet"> | <link href="https://lib.baomitu.com/font-awesome/5.0.8/web-fonts-with-css/css/fontawesome-all.css" rel="stylesheet"> | ||
<style type="text/css"> | <style type="text/css"> | ||
| − | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list {z-index:100;height:0px;min-width: 98px;border-left: 2px solid #f4c430;display: inline-block;background:#333;position:absolute;margin: 0;padding: 0;overflow: hidden; | + | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list {z-index:100;height:0px;min-width: 98px;border-left: 2px solid #f4c430;display: inline-block;background:#333;position:absolute;margin: 0;padding: 0;overflow: hidden;} |
#firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li {position: relative;padding: 0;font-size:10px;line-height:15px;display: table;width: 100%;margin: 0px;} | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li {position: relative;padding: 0;font-size:10px;line-height:15px;display: table;width: 100%;margin: 0px;} | ||
#firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li:hover {background-color: #555;color:white;transition:all 0.1s ease-in-out} | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li:hover {background-color: #555;color:white;transition:all 0.1s ease-in-out} | ||
| 第13行： | 第13行： | ||
#firstHeading > div.mw-prefixindex-body {display: inline-block;position: relative;margin-left: 0.3em;vertical-align: text-bottom;width: 100px;} | #firstHeading > div.mw-prefixindex-body {display: inline-block;position: relative;margin-left: 0.3em;vertical-align: text-bottom;width: 100px;} | ||
#firstHeading > div.mw-prefixindex-body p {color: #333;cursor: default;display: table;font-size: 15px;background-image: linear-gradient(-45deg, transparent 5px, #f4c430 5px);padding: 1px 7px 1px 5px;margin: 0px 0px 0.5em 0px;border-radius: 2px;} | #firstHeading > div.mw-prefixindex-body p {color: #333;cursor: default;display: table;font-size: 15px;background-image: linear-gradient(-45deg, transparent 5px, #f4c430 5px);padding: 1px 7px 1px 5px;margin: 0px 0px 0.5em 0px;border-radius: 2px;} | ||
| − | |||
#firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li:hover::after {border-left: 5px solid #f4c430} | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li:hover::after {border-left: 5px solid #f4c430} | ||
#firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li::after {left: 0px;top: 12px;position: absolute;content: '';border-left: 0px solid transparent;;border-top: 5px solid transparent;border-bottom: 5px solid transparent;width: 10px;transition:all 0.1s ease-in-out} | #firstHeading > div.mw-prefixindex-body > ul.mw-prefixindex-list li::after {left: 0px;top: 12px;position: absolute;content: '';border-left: 0px solid transparent;;border-top: 5px solid transparent;border-bottom: 5px solid transparent;width: 10px;transition:all 0.1s ease-in-out} | ||
| 第25行： | 第24行： | ||
var a = document.querySelectorAll('#firstHeading > div.mw-prefixindex-body > ul a'); | var a = document.querySelectorAll('#firstHeading > div.mw-prefixindex-body > ul a'); | ||
var b = document.querySelectorAll('#firstHeading > div.mw-prefixindex-body > ul li'); | var b = document.querySelectorAll('#firstHeading > div.mw-prefixindex-body > ul li'); | ||
| − | + | var wd= a.length * 30 | |
| + | var tr= a.length * 0.05 | ||
| + | addCssRule('#firstHeading > div.mw-prefixindex-body:hover ul.mw-prefixindex-list', 'height:' + wd + 'px;'); //自定义函数，位于head内 用法 addCssRule (selector ,style ,index);index为插入顺序 同一元素较后的覆盖前面的 | ||
| + | addCssRule('#firstHeading > div.mw-prefixindex-body > ul', 'transition:all ' + tr + 's ease-in-out'); | ||
for (var i = 0; i < a.length; i++) { | for (var i = 0; i < a.length; i++) { | ||
if (current == a[i].innerHTML) {b[i].className="active";}; | if (current == a[i].innerHTML) {b[i].className="active";}; | ||
2018年12月8日 (六) 18:46的版本
{{#Widget:子页面列表|mainpage=Widget:子页面列表|subpage1=测试|subcount=1|active=0}}
