MCBBS Wiki欢迎您共同参与编辑!在参与编辑之前请先阅读Wiki方针。
如果在编辑的过程中遇到了什么问题,可以去讨论板提问。
为了您能够无阻碍地参与编辑 未验证/绑定过邮箱的用户,请尽快绑定/验证。
MCBBS Wiki GitHub群组已上线!
您可以在回声洞中发表吐槽!
服务器状态监控。点击进入
本站由MCBBS用户自行搭建,与MCBBS及东银河系漫游指南(北京)科技有限公司没有从属关系。点此了解 MCBBS Wiki 不是什么>>
Gadget:backToTop.js:修订间差异
跳到导航
跳到搜索
(// Edit via Wikiplus) |
(// Edit via Wikiplus) |
||
第1行: | 第1行: | ||
/ |
/* 引自萌百,有修改。*/ |
||
// <pre> |
|||
/* 回到顶部 */ |
|||
"use strict"; |
|||
$(function |
$(function() { |
||
var body = document.body, |
|||
var btn = insertToBottomRightCorner("返回顶部").attr({ |
|||
html = document.documentElement; |
|||
var innerWidth = window.innerWidth; |
|||
⚫ | |||
var scrollbarWidth; |
|||
⚫ | |||
switch ("scroll") { |
|||
case getComputedStyle(body).overflowY: |
|||
transition: "opacity .13s ease-in-out", |
|||
scrollbarWidth = innerWidth - body.clientWidth; |
|||
⚫ | |||
break; |
|||
⚫ | |||
case getComputedStyle(html).overflowY: |
|||
scrollbarWidth = innerWidth - html.clientWidth; |
|||
break; |
|||
default: |
|||
var |
var backup = body.style.overflowY; |
||
body.style.overflowY = "scroll"; |
|||
scrollbarWidth = innerWidth - body.clientWidth; |
|||
⚫ | |||
body.style.overflowY = backup; |
|||
}).trigger("scroll"); |
|||
} |
|||
var btn = $("<div/>", { |
|||
⚫ | |||
"attr": { |
|||
"title": "返回顶部", |
|||
⚫ | |||
}, |
|||
⚫ | |||
"user-select": "none" |
|||
}, |
|||
"on": { |
|||
⚫ | |||
$("html, body").animate({ |
|||
scrollTop: 0 |
|||
}, 120); |
|||
} |
|||
} |
|||
}).appendTo(document.body); |
|||
if (scrollbarWidth === 0) { |
|||
btn.css("right", "20px"); // 修复新版 Chrome 的自动隐藏式滚动条导致的按钮被覆盖 chrome://flags/#overlay-scrollbars |
|||
} |
|||
$(window).on("scroll", function() { |
|||
⚫ | |||
}).scroll(); |
|||
}); |
}); |
||
// </pre> |
2023年7月18日 (二) 12:52的版本
/* 引自萌百,有修改。*/
// <pre>
/* 回到顶部 */
$(function() {
var body = document.body,
html = document.documentElement;
var innerWidth = window.innerWidth;
var scrollbarWidth;
switch ("scroll") {
case getComputedStyle(body).overflowY:
scrollbarWidth = innerWidth - body.clientWidth;
break;
case getComputedStyle(html).overflowY:
scrollbarWidth = innerWidth - html.clientWidth;
break;
default:
var backup = body.style.overflowY;
body.style.overflowY = "scroll";
scrollbarWidth = innerWidth - body.clientWidth;
body.style.overflowY = backup;
}
var btn = $("<div/>", {
"text": "",
"attr": {
"title": "返回顶部",
"class": "backToTop"
},
"css": {
"user-select": "none"
},
"on": {
"click": function() {
$("html, body").animate({
scrollTop: 0
}, 120);
}
}
}).appendTo(document.body);
if (scrollbarWidth === 0) {
btn.css("right", "20px"); // 修复新版 Chrome 的自动隐藏式滚动条导致的按钮被覆盖 chrome://flags/#overlay-scrollbars
}
$(window).on("scroll", function() {
$(document).scrollTop() > 0 ? btn.fadeIn() : btn.fadeOut();
}).scroll();
});
// </pre>