From 2eb8596e0a3024936203d154803b6d872d83bef7 Mon Sep 17 00:00:00 2001 From: "1152958806@qq.com" <17683872107czx> Date: Thu, 7 Sep 2023 12:30:46 +0800 Subject: [PATCH] =?UTF-8?q?=E4=B8=8A=E4=B8=80=E7=AF=87=EF=BC=8C=E4=B8=8B?= =?UTF-8?q?=E4=B8=80=E7=AF=87=E6=A0=B7=E5=BC=8F=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- templates/assets/js/heo.js | 12 +- .../assets/libs/twikoo/commentBarrage.css | 2 +- .../assets/libs/twikoo/commentBarrage.js | 23 --- templates/assets/zhheo/blogex.js | 65 ++----- templates/assets/zhheo/zhheoblog.css | 176 +++++++++++++----- templates/modules/common/rightside.html | 6 + templates/modules/footer.html | 4 +- templates/post.html | 6 +- 8 files changed, 164 insertions(+), 130 deletions(-) diff --git a/templates/assets/js/heo.js b/templates/assets/js/heo.js index cb624178..5c580018 100644 --- a/templates/assets/js/heo.js +++ b/templates/assets/js/heo.js @@ -5,7 +5,8 @@ let heo_cookiesTime = null ,heo_musicPlaying = false ,heo_keyboard = false ,heo_intype = false -,lastSayHello = ""; +,lastSayHello = "" +,refreshNum = 1; // 私有函数 var heo = { // 检测显示模式 @@ -67,6 +68,12 @@ var heo = { // 页脚友链 addFriendLinksInFooter: function () { + var footerRandomFriendsBtn = document.getElementById("footer-random-friends-btn"); + if(!footerRandomFriendsBtn) return; + footerRandomFriendsBtn.style.opacity = "0.2"; + footerRandomFriendsBtn.style.transitionDuration = "0.3s"; + footerRandomFriendsBtn.style.transform = "rotate(" + 360 * refreshNum++ + "deg)"; + const fetchUrl = "/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links?keyword=&sort=priority,asc" const linksUrl = GLOBAL_CONFIG.source.links.linksUrl const num = GLOBAL_CONFIG.source.links.linksNum @@ -84,6 +91,9 @@ var heo = { document.getElementById("friend-links-in-footer").innerHTML = htmlText; } }) + setTimeout(()=>{ + footerRandomFriendsBtn.style.opacity = "1"; + }, 300) }, //禁止图片右键单击 diff --git a/templates/assets/libs/twikoo/commentBarrage.css b/templates/assets/libs/twikoo/commentBarrage.css index ef42743b..5aece2fa 100644 --- a/templates/assets/libs/twikoo/commentBarrage.css +++ b/templates/assets/libs/twikoo/commentBarrage.css @@ -1,7 +1,7 @@ .comment-barrage { position: fixed; bottom: 0; - right: 20px; + right: 60px; padding: 0 0 20px 10px; z-index: 100; display: flex; diff --git a/templates/assets/libs/twikoo/commentBarrage.js b/templates/assets/libs/twikoo/commentBarrage.js index a2a5eadd..8dd327c0 100644 --- a/templates/assets/libs/twikoo/commentBarrage.js +++ b/templates/assets/libs/twikoo/commentBarrage.js @@ -137,29 +137,6 @@ if(GLOBAL_CONFIG.htmlType!='comments') { }, 1000) } - -// 自动隐藏 - document.addEventListener('scroll', btf.throttle(function () { - //滚动条高度+视窗高度 = 可见区域底部高度 - var visibleBottom = window.scrollY + document.documentElement.clientHeight; - //可见区域顶部高度 - var visibleTop = window.scrollY; - // 获取翻页按钮容器 - var pagination = document.querySelector('.comment-barrage'); - // 获取位置监测容器,此处采用评论区 - var eventlistner = document.getElementById('post-comment'); - if (eventlistner && pagination) { - var centerY = eventlistner.offsetTop + 200; - if (document.body.clientWidth > 768) { - if (centerY > visibleBottom) { - pagination.style.bottom = '0'; - } else { - pagination.style.bottom = '-200px'; - } - } - } - }, 200)) - initCommentBarrage(); if (localStorage.getItem('commentBarrageSwitch') !== 'false') { diff --git a/templates/assets/zhheo/blogex.js b/templates/assets/zhheo/blogex.js index 78aea839..8946cbd6 100644 --- a/templates/assets/zhheo/blogex.js +++ b/templates/assets/zhheo/blogex.js @@ -1,12 +1,5 @@ -// var full_page = document.getElementsByClassName("full_page"); -// if (full_page.length != 0) { -// full_page[0].style.background = "transparent"; -// } - - -function checkOpen() { -} +function checkOpen() {} checkOpen.toString = function () { this.opened = true; }; @@ -191,24 +184,6 @@ function showcopy() { } } -//导航栏上显示标题 -// var OriginTitile = document.title; -// var titleTime; -// document.addEventListener('visibilitychange', function () { -// if (document.hidden) { -// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png"); -// document.title = '张洪Heo'; -// clearTimeout(titleTime); -// } -// else { -// // $('[rel="shortcut icon"]').attr('href', "https://cdn.jsdelivr.net/gh/Akilarlxh/Akilarlxh.github.io@v3.3.3_3/img/siteicon/favicon.png"); -// document.title = OriginTitile; -// // titleTime = setTimeout(function () { -// // document.title = OriginTitile; -// // }, 2000); -// } -// }); - // 早上好问好 // 获取时间 var getTimeState = () => { @@ -390,7 +365,6 @@ document.addEventListener('scroll', btf.throttle(function () { heo.initThemeColor() }, 200)) -//友链随机传送 //友链随机传送 function travelling() { const links = "/apis/api.plugin.halo.run/v1alpha1/plugins/PluginLinks/links?keyword=&sort=priority,asc" @@ -577,29 +551,19 @@ $(".topGroup").hover(function () { }); -//文章页面上一篇下一篇 -// document.addEventListener('scroll', btf.throttle(function () { -// //滚动条高度+视窗高度 = 可见区域底部高度 -// var visibleBottom = window.scrollY + document.documentElement.clientHeight; -// //可见区域顶部高度 -// var visibleTop = window.scrollY; -// // 获取翻页按钮容器 -// var pagination = document.getElementById('pagination'); -// // 获取位置监测容器,此处采用评论区 -// var eventlistner = document.getElementById('post-tools'); -// if (eventlistner && pagination) { -// var centerY = eventlistner.offsetTop + (eventlistner.offsetHeight / 2); -// if (document.body.clientWidth > 1300) { -// if (centerY < visibleTop) { -// pagination.classList.add("show-window"); -// } else { -// pagination.classList.remove("show-window"); -// } -// } -// } -// }, 200)); - - +function initObserver() { + var e = document.getElementById("post-comment") + , t = document.getElementById("pagination"); + e && new IntersectionObserver((function(e) { + e.forEach((function(e) { + e.isIntersecting ? (t && t.classList.add("show-window"), + document.querySelector(".comment-barrage").style.bottom = "-200px") : (t && t.classList.remove("show-window"), + document.querySelector(".comment-barrage").style.bottom = "0px") + } + )) + } + )).observe(e) +} // 页面百分比 function percent() { @@ -670,6 +634,7 @@ function initBlog() { heo.initThemeColor(), //隐藏加载动画 GLOBAL_CONFIG.loadingBox && heo.hideLoading(), + initObserver(), checkUrlAndAddHideBanner() } diff --git a/templates/assets/zhheo/zhheoblog.css b/templates/assets/zhheo/zhheoblog.css index 12a061e4..7cc80f1e 100644 --- a/templates/assets/zhheo/zhheoblog.css +++ b/templates/assets/zhheo/zhheoblog.css @@ -3187,14 +3187,6 @@ ul { height: 150px; } -#pagination .next-post2 a, -#pagination .prev-post2 a { - position: relative; - display: block; - overflow: hidden; - height: 150px; -} - #pagination .next-post:hover img.next-cover, #pagination .next-post:hover img.prev-cover, #pagination .prev-post:hover img.next-cover, @@ -11553,13 +11545,6 @@ a.reward-main-btn:hover { background: #363636; } -.next-post2.pull-right, -.prev-post2.pull-left, -#pagination .prev-post2, -#pagination .next-post2 { - background: #363636; -} - #preimg{ position: absolute; width: 100%; @@ -11573,10 +11558,7 @@ a.reward-main-btn:hover { object-fit: cover; border-radius: 0; } -.prev-post2.pull-left:hover #preimg { - opacity: 1; - transform: scale(1.1); -} + .prev-post.pull-left:hover #preimg { opacity: 1; transform: scale(1.1); @@ -11587,15 +11569,10 @@ a.reward-main-btn:hover { transform: scale(1.1); } -.next-post2.pull-right:hover #preimg { - opacity: 1; - transform: scale(1.1); -} - @media screen and (min-width: 768px) { #pagination .next-post a { - border-left: var(--heo-card-bg); - border-left-width: 3px; + border-left:var(--heo-main-op); + border-left-width: .5px; border-left-style: solid; display: flex; align-items: flex-start; @@ -11607,9 +11584,9 @@ a.reward-main-btn:hover { } #pagination .prev-post a { - border-right: var(--heo-card-bg); - border-right-width: 3px; - border-right-style: solid; + border-right: var(--heo-main-op); + border-right-width: .5px; + border-right-style: solid } #pagination .pagination-info { @@ -11623,17 +11600,16 @@ a.reward-main-btn:hover { margin: auto; height: 100%; } - #pagination .prev-post a:hover div, - #pagination .next-post a:hover div { - color: var(--heo-white) !important; + + #pagination .next-post a:hover div,#pagination .prev-post a:hover div { + color: var(--heo-white)!important } } @media screen and (max-width: 768px) { - #pagination .prev-post a:hover, - #pagination .next-post a:hover { - background: var(--heo-none); + #pagination .next-post a:hover,#pagination .prev-post a:hover { + background:var(--heo-none) } } @@ -11658,37 +11634,137 @@ a.reward-main-btn:hover { filter: blur(5px); } -#post #pagination .prev-post .label, -#pagination .next-post .label { - color: white; -} - -#post #pagination .prev-post2 .label, -#pagination .next-post2 .label { - color: white; -} - -#post #pagination .prev_info, -#pagination .next_info { - color: white; - font-weight: bold; +#pagination .next_info,#post #pagination .prev_info { + font-weight: 700; -webkit-line-clamp: 2; white-space: normal; line-height: 1.3; - font-size: 0.9rem; + font-size: .9rem; display: -webkit-box; -webkit-box-orient: vertical; + overflow: hidden; + margin-bottom: 10px } #post #pagination { overflow: hidden; position: inherit; + border: var(--style-border-always) } #pagination.pagination-post { background: var(--heo-card-bg); } +@media screen and (min-width: 1300px) { + #post #pagination { + position:fixed; + width: 300px; + bottom: -100px; + right: 60px; + z-index: 1000; + height: fit-content; + transition: cubic-bezier(.42,0,.3,1.11) .3s; + border: var(--style-border); + border-radius: 12px; + overflow: hidden; + cursor: pointer; + opacity: 0; + z-index: 1002 + } + + + + #post #pagination.show-window { + bottom: 20px; + opacity: 1 + } + + #post #pagination:hover { + border: var(--style-border-hover) + } + + #pagination .next-post a,#pagination .prev-post a { + border: none; + height: fit-content; + padding: .5rem 0 + } + + #pagination.pagination-post { + border-radius: 0 + } + + #pagination .next_info,#post #pagination .prev_info { + font-size: 14px; + font-weight: 400; + margin-bottom: 0 + } + + #pagination .pagination-info { + padding: .5rem 1rem; + transform: none + } + + #post #pagination { + background: 0 0 + } + + #pagination .next_info,#post #pagination .prev_info { + color: var(--heo-fontcolor); + } + + #pagination .next-post,#pagination .prev-post,.next-post.pull-right,.prev-post.pull-left { + background: var(--heo-maskbgdeep); + -webkit-backdrop-filter: blur(5px); + backdrop-filter: blur(5px); + transform: translateZ(0) + } + + #pagination .next-post a:hover,#pagination .prev-post a:hover { + background: var(--heo-main); + } + + #pagination .next-post .label,#post #pagination .prev-post .label { + color: var(--heo-fontcolor) + } + + #pagination.pagination-post .next-post.pull-full img,#pagination.pagination-post .next-post.pull-right img,#pagination.pagination-post .prev-post.pull-full img,#pagination.pagination-post .prev-post.pull-left img { + display: none; + top: 0 + } + + + #post #pagination .prev-post .label, + #pagination .next-post .label { + color: var(--heo-fontcolor) + } + + + .prev-post.pull-left { + display: none + } + + .next-post.pull-right { + width: 100%!important + } + + #pagination .next-post .pagination-info { + text-align: left; + position: relative + } + + #pagination .next-post .label,#post #pagination .prev-post .label { + color: var(--heo-fontcolor); + font-weight: 700; + font-size: 12px; + margin-bottom: .5rem; + border-bottom: var(--style-border); + line-height: 1; + padding-bottom: .5rem + } + +} + @media screen and (max-width: 768px) { .prev-post.pull-left { border-bottom: var(--style-border-always); diff --git a/templates/modules/common/rightside.html b/templates/modules/common/rightside.html index dd52dfaa..fd8cca35 100644 --- a/templates/modules/common/rightside.html +++ b/templates/modules/common/rightside.html @@ -19,6 +19,12 @@ #rightside { display: none; } + .comment-barrage { + right: 20px; + } + #post #pagination { + right: 20px; + }
diff --git a/templates/post.html b/templates/post.html index 29befe5c..31ecee43 100644 --- a/templates/post.html +++ b/templates/post.html @@ -128,10 +128,10 @@