You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
81 lines
2.9 KiB
81 lines
2.9 KiB
<div class="footer-box">
|
|
<!-- 设置滚动条和进度比例 -->
|
|
<div class="back-to-top" id="back_to_top">
|
|
<!-- 箭头-->
|
|
<!-- https://www.toptal.com/designers/htmlarrows/-->
|
|
<!-- 箭头 <span>↑</span> -->
|
|
<!-- <span>↑</span> -->
|
|
<span><i class="fas fa-arrow-up"></i></span> <!-- 需要FontAwesome支持，参见文末-->
|
|
<!-- 进度比例 -->
|
|
<span class="scrollpercent">
|
|
<span id="back_to_top_text">0</span>%
|
|
</span>
|
|
</div>
|
|
</div>
|
|
<script type="text/javascript">
|
|
let sideBarOpen = 'sidebar-open';
|
|
let body = document.body;
|
|
let back2Top = document.querySelector('#back_to_top'),
|
|
back2TopText = document.querySelector('#back_to_top_text'),
|
|
drawerBox = document.querySelector('#drawer_box'),
|
|
rightSideBar = document.querySelector('.sidebar'),
|
|
viewport = document.querySelector('body');
|
|
|
|
function scrollAnimation(currentY, targetY) {
|
|
let needScrollTop = targetY - currentY
|
|
let _currentY = currentY
|
|
setTimeout(() => {
|
|
const dist = Math.ceil(needScrollTop / 10)
|
|
_currentY += dist
|
|
window.scrollTo(_currentY, currentY)
|
|
if (needScrollTop > 10 || needScrollTop < -10) {
|
|
scrollAnimation(_currentY, targetY)
|
|
} else {
|
|
window.scrollTo(_currentY, targetY)
|
|
}
|
|
}, 1)
|
|
}
|
|
|
|
back2Top.addEventListener("click", function (e) {
|
|
scrollAnimation(document.scrollingElement.scrollTop, 0);
|
|
e.stopPropagation();
|
|
return false;
|
|
});
|
|
|
|
window.addEventListener('scroll', function (e) {
|
|
let percent = document.scrollingElement.scrollTop / (document.scrollingElement.scrollHeight - document.scrollingElement.clientHeight) * 100;
|
|
if (percent > 1 && !back2Top.classList.contains('back-top-active')) {
|
|
back2Top.classList.add('back-top-active');
|
|
}
|
|
if (percent == 0) {
|
|
back2Top.classList.remove('back-top-active');
|
|
}
|
|
if (back2TopText) {
|
|
back2TopText.textContent = Math.floor(percent);
|
|
}
|
|
});
|
|
let hasCacu = false;
|
|
window.onresize = function () {
|
|
//calcuHeight();
|
|
}
|
|
|
|
{{- if .Params.schemaJson }}
|
|
fetch('{{ $.Site.BaseURL }}/schema/{{ .Params.schemaJson }}.json')
|
|
.then(response => response.text())
|
|
.then(structuredDataText => {
|
|
const script = document.createElement('script');
|
|
script.setAttribute('type', 'application/ld+json');
|
|
script.textContent = structuredDataText;
|
|
document.head.appendChild(script);
|
|
});
|
|
{{- end }}
|
|
</script>
|
|
<script src="/libs/bootstrap-5.2.3/js/bootstrap.bundle.js"></script>
|
|
{{if .Page.Site.Params.fancybox }}
|
|
<script type="text/javascript" src="/assets/js/jquery.min-3.2.1.js" id="jquery-js"></script>
|
|
<link rel="stylesheet" href="/assets/css/jquery.fancybox.min.css" />
|
|
<script src="/assets/js/fancybox.min-3.5.7.js"></script>
|
|
{{ end }}
|
|
{{ partial "diy_script.html" . }}
|
|
</body>
|
|
</html>
|