Greasy Fork is available in English.
在bilibili网页端上方菜单添加[关注]的列表，可自定义更改关注列表，快速进入你关注的up主空间。
当前为
// ==UserScript==
// @name b站首页增加[关注]列表
// @version 5.1
// @description 在bilibili网页端上方菜单添加[关注]的列表，可自定义更改关注列表，快速进入你关注的up主空间。
// @author 冬瓜语
// @match *://www.bilibili.com/*
// @namespace http://greasyfork.icu/users/307669
// ==/UserScript==
(function() {
var cookies = document.cookie;
var id=cookies.match(/DedeUserID=(\d+)/)[1];
go();
function go(){
var Obj=document.querySelector("[report-id=playpage_dynamic]");
if(Obj){
$("<li report-id='big_tab_click' class='nav-item'> <div id='close'> <a report-id='Focus' href='//space.bilibili.com/"+id+"/fans/follow' id='ty' target='_blank' class='t' >关注</a></div></li>").insertAfter(Obj);
$("<div style='display:none;box-shadow:rgba(0,0,0,0.16) 0px 2px 4px;position: absolute; background: #E5E9EF; border-radius: 10px; padding: 20px; top: 400px; left: 50%; width: 600px;height: 210px; transform: translate(-50%, -50%); cursor: default;'>aaaaaaa</div>").insertAfter(Obj);
var Obj_menu=document.querySelector("[report-id=Focus]");
$("<div id='hh' style='display:none;opacity:0;position: absolute;z-index: 1;width: 110px; height: 42px; background-color: #FFF; border-radius: 0 0 4px 4px; box-shadow:rgba(0,0,0,0.16) 0px 2px 4px; top:46px;left:-35px;'><ul id='u' report-id='UP' class='sub-nav' style='padding: 0px;margin: 0px;'></ul></div>").insertAfter(Obj_menu);
var Obj_UP=document.querySelector("[report-id=UP]");
var now = window.location.href;
// if(now=="https://www.bilibili.com/"){ //只有首页可以使用设置按钮
$("<a id='setting' class='im-list' href=# style='display: block; color: #222222;'>设置</a>").insertAfter(Obj_UP);
// }
/**
*自动添加元素
*/
if(localStorage.length>0){
var number = 1;
var x="a";
for(var i=0;i<localStorage.length;i++){
var sitename = localStorage.key(i);
var mark = sitename.search("兾");
if(mark == 0){
var Nname=sitename.substring(1)
var siteurl = localStorage.getItem(sitename);
$("<a id='aa' class='im-list' href='#' target='_blank' style='display: block; color: #222222;'>name</a>").insertAfter(Obj_UP);
document.getElementById("aa").innerHTML=Nname;
document.getElementById("aa").href=siteurl;
x="a"+number.toString();
$('#aa').attr('id', x);
number++;
}
}
}
/**
*设置按钮（打开设置面板）
*/
$(document).ready(function(){
$("#setting").click(function(){
$("body").css({overflow:"hidden"}); //禁用滚动条
document.getElementById("BackGround").style.display="";
$("#hh").animate({
opacity: 0,
top:"46px",
},300);
setTimeout(hid,300); //动画结束后隐藏
function hid(){
document.getElementById("hh").style.display="none";
}
});
});
$(document).ready(function(){
$("#closeX").click(function(){
$("body").css({overflow:""}); //启用滚动条
document.getElementById("BackGround").style.display="none";
$("#closeX").animate({
fontSize:"20px",
})
});
$("#shadow").click(function(){
$("body").css({overflow:""}); //启用滚动条
document.getElementById("BackGround").style.display="none";
});
});
/**
*计算列表高度
*/
var word = document.getElementsByClassName("im-list");
var number2=0;
for(var j in word){number2++;}
var h=(number2-3)*42;
document.getElementById("hh").style.height = h+"px";
/**
*鼠标悬停产生阴影
*/
for(var k in word)
{
word[k].onmouseover = function(){
this.style.background="#E5E9EF";
this.style.color="#00AED6";
this.style.borderRadius="0 0 4px 4px"; //会使每一个超链接被选中时都变成圆角
}
word[k].onmouseout = function(){
this.style.background="#FFF";
this.style.color="#222222";
this.style.borderRadius="0 0 4px 4px"; //会使每一个超链接被选中时都变成圆角
}
}
var first=document.body.firstChild;
/**
*可视化窗口
*/
$("<div id='BackGround'style='display:none;'><div id='shadow' style='width:100%;height:100%;background:black;position:absolute;z-index:10001;top: 0;left: 0;filter:alpha(opacity:80);opacity:0.8;'></div> <div id='panel' style='box-shadow:rgba(0.5,0.5,0.5,0.5) 4px 4px 4px 4px;position: absolute; background: white; border-radius: 10px; padding: 20px; top: 400px; left: 50%; width: 500px;height: 410px; transform: translate(-50%, -50%); cursor: default;z-index:10002;filter:alpha(opacity:100);opacity:1;'> <text style='font-size:20px'>设置</text> <text id='closeX' style='font-size:20px;float:right'>X</text> <p><br><br></p> <form> 请输入UP主的名称: <input id='Name' type='text'placeholder='如：敖厂长' required='required' maxlength='9' style='color:gray; width: 280px'></form> <p><br></p> <form report-id='Theurl'> 请输入UP主的网址: <input id='Url' placeholder='如：https://space.bilibili.com/122879' required='required' style='color:gray; width: 280px'><br><br> <button id='submit'style='color:#00AED6; border: none;background-color: white;padding: 2px 10px;border-radius:6px 6px 6px 6px;box-shadow:0 5px 5px 0 rgba(0,0,0.1,0.1);cursor:pointer;' > 添加 </button> <button id='delete' style='color:#00AED6; border: none;background-color: white;padding: 2px 10px;border-radius:6px 6px 6px 6px;box-shadow:0 5px 5px 0 rgba(0,0,0.1,0.1);cursor:pointer;'> 删除 </button> <button id='clear'style='color:#00AED6; border: none;background-color: white;padding: 2px 10px;border-radius:6px 6px 6px 6px;box-shadow:0 5px 5px 0 rgba(0,0,0.1,0.1);cursor:pointer;'> 清空所有 </button> <text style='font-size:9px;'>提示：删除操作只需填写已有的UP主名称即可</text> </form> <br> <p><br><br></p> <div id='list' style='cellpadding:10;'></div> </div></div>").insertBefore(first);
/**
*显示现有元素
*/
$(document).ready(function(){
var list = document.getElementById("list");
if(localStorage.length>0){
var result = "<table border='1'>";
result += "<tr><td>UP主</td><td>网址</td></tr>";
for(var i=0;i<localStorage.length;i++){
var sitename = localStorage.key(i);
var mark = sitename.search("兾");
if(mark == 0){
var Nname=sitename.substring(1)
var siteurl = localStorage.getItem(sitename);
result += "<tr><td>"+Nname+"</td><td>"+siteurl+"</td></tr>";
}
}
result += "</table>";
list.innerHTML = result;
}else{
list.innerHTML = "数据为空……";
}
});
var Turl=document.querySelector("[report-id=Theurl]");
// $(" ").insertAfter(Turl);
/**
*增加记录
*/
$(document).ready(function(){
$("#submit").mouseenter(function(){ //悬停变色
document.getElementById("submit").style.color="red";
});
$("#submit").mouseleave(function(){
document.getElementById("submit").style.color="#00AED6";
});
$("#submit").click(function(){
var name=document.getElementById("Name").value;
var Nname="兾"+name;
var address=document.getElementById("Url").value;
if (name==null || name==""){
alert("Up主名称不可为空！");
}
else if (address==null || address==""){
alert("Up主网址不可为空！");
}else{
localStorage.setItem(Nname, address);
alert("添加成功！刷新后生效！");
}
});
});
/**
*删除记录
*/
$(document).ready(function(){
$("#delete").mouseenter(function(){ //悬停变色
document.getElementById("delete").style.color="red";
});
$("#delete").mouseleave(function(){
document.getElementById("delete").style.color="#00AED6";
});
$("#delete").click(function(){
var name=document.getElementById("Name").value;
var mk = 0;
if (name==null || name==""){
alert("Up主名称不可为空！");
}else{
for(var i=0;i<localStorage.length;i++){
var sitename = localStorage.key(i);
var mark = sitename.search("兾");
if(mark == 0 && name==sitename.substring(1)){
localStorage.removeItem(sitename);
mk = 1;
}
}
if(mk==1){alert("删除成功！刷新后生效！");mk=0;}
else{alert("删除失败！（可能没有找到您输入的Up主名称）");}
}
});
});
/**
*清空记录
*/
$(document).ready(function(){
$("#clear").mouseenter(function(){ //悬停变色
document.getElementById("clear").style.color="red";
});
$("#clear").mouseleave(function(){
document.getElementById("clear").style.color="#00AED6";
});
$("#clear").click(function(){
var r=confirm("您确定要清空所以关注内容吗？");
if (r==true){
localStorage.clear();
alert("清除成功！刷新后生效！");
}
});
});
/**
*鼠标悬停展开列表
*/
$(document).ready(function(){
$("#ty").mouseenter(function(){
setTimeout(show,300);
function show(){
document.getElementById("hh").style.display="";
$("#hh").animate({
opacity: 1,
top:"42px",
},300);
}
});
});
/**
*鼠标移出隐藏列表
*/
$(document).ready(function(){
$("#close").mouseleave( function(){
$("#hh").animate({
opacity: 0,
top:"46px",
},300);
setTimeout(hid,300); //动画结束后隐藏
function hid(){
document.getElementById("hh").style.display="none";
}
});
});
/**==============================
* 优化界面样式
*===============================
*/
/**
*关闭按钮X特效
*/
$(document).ready(function(){
$("#closeX").mouseenter(function(){
$("#closeX").animate({
fontSize:"30px",
})
});
});
$(document).ready(function(){
$("#closeX").mouseleave(function(){
$("#closeX").animate({
fontSize:"20px",
})
});
});
}else{setTimeout(go,500);}
}
})();
/*
特别说明：此脚本为作者初学时编写，如有任何问题欢迎联系作者（e-mail：[email protected]）
更新日志：
version 5.1 2019/6/25
1、优化了设置界面，试图使界面变得更美观（笑）。
2、现在点击“清空所有”的按钮后会弹出确认框。
3、暂时关闭了除b站首页以外地方的【关注】入口。
*已知bug：在b站首页以外的地方无法读取本地储存。
version 5.0 2019/6/14
1、增添了可视化设置界面，用户再也不用去改代码辣，更新也不再覆盖用户的自定义内容辣！
2、现在用户可以在设置里对自己的关注列表进行增删查的操作。
3、这是一次历史性的更新。
version 4.0 2019/6/9
1、优化了代码结构。
2、自动计算列表高度，方便用户自由增加或减少关注列表。
3、修改了使用说明。
version 3.1 2019/6/8
1、删除了【追番】入口。
2、更改了脚本功能的描述。
version 3.0 2019/6/7
1、实现了子菜单淡入淡出的同时滑动出场退场的效果。
2、优化了子菜单的延迟显示效果。
3、优化了代码算法逻辑。
待解决的问题：
1、鼠标悬停时每一个超链接都会变成圆角。
2、当鼠标频繁选中和离开时会导致菜单频繁打开关闭。
version 2.0 2019/6/7
1、更改了事件的触发方式，将“点击”触发替换成“悬停”触发。
2、优化了鼠标选中时改变背景色和字体颜色。
3、优化了菜单栏的圆角。
4、优化了菜单栏的阴影。
5、优化了字体。
6、优化了菜单栏的居中。
7、优化了代码逻辑。
待解决的问题：
1、存在鼠标悬停在最后一个超链接时改变背景色的同时会改变圆角的bug，修复后解决了此bug但又出现了使每一个超链接被选中时都变成圆角的新bug。
2、子菜单弹出没有实现延迟显示功能。
3、子菜单没有实现淡入淡出的效果。
4、鼠标频繁选中会导致菜单频繁打开。
version 1.0 2019/6/3
1、增添了【追番】入口。
2、增添了【关注】入口。
3、添加了子菜单栏。
待解决的问题：
1、【关注】入口的事件触发方式目前为“点击”，悬停触发事件的方式目前存在不可抗拒的Bug，后续版本更新中会陆续解决。
2、子菜单中鼠标悬停还不能更改背景色。
3、子菜单弹出没有实现延迟显示功能。
4、子菜单没有实现圆角和阴影的样式。
5、子菜单位置整体偏右。
6、添加关注元素时需改动的代码过多。
7、算法逻辑混乱，尚未修改。
*/