From c0bd8e75560ab586db572f221cc6043912bc80ae Mon Sep 17 00:00:00 2001 From: User Date: Fri, 13 Mar 2026 14:07:38 +0800 Subject: [PATCH] =?UTF-8?q?style:=20=E4=BC=98=E5=8C=96=E9=A1=B5=E8=84=9A?= =?UTF-8?q?=E5=9B=BE=E7=89=87=E5=B0=BA=E5=AF=B8=E5=8F=8A=E5=9E=82=E7=9B=B4?= =?UTF-8?q?=E5=B1=85=E4=B8=AD=E6=8E=92=E7=89=88=E5=AF=B9=E9=BD=90?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- argontheme.js | 64 ++++++- comments.php | 4 +- footer.html | 279 ++++++++++++++++++++++++++++ sidebar.php | 4 +- style.css | 62 +++++-- template-parts/emotion-keyboard.php | 2 +- 6 files changed, 391 insertions(+), 24 deletions(-) create mode 100644 footer.html diff --git a/argontheme.js b/argontheme.js index a93b5cd..e5b1a1b 100644 --- a/argontheme.js +++ b/argontheme.js @@ -2150,15 +2150,60 @@ $(document).on('click', '.comment-upvote', function () { function lazyloadStickers() { // 原生懒加载无需额外处理 } -$(document).on("click", "#comment_emotion_btn", function () { - $("#comment_emotion_btn").toggleClass("comment-emotion-keyboard-open"); + +function positionEmotionKeyboard() { + var btn = document.getElementById("comment_emotion_btn"); + var keyboard = document.getElementById("emotion_keyboard"); + if (!btn || !keyboard) return; + + // Ensure keyboard is a child of body to avoid stacking context & clipping issues + if (keyboard.parentElement !== document.body) { + document.body.appendChild(keyboard); + } + + var btnRect = btn.getBoundingClientRect(); + var keyboardHeight = 300; + var keyboardWidth = Math.min(500, window.innerWidth - 40); + + var top = btnRect.top + window.scrollY - keyboardHeight - 10; + var left = btnRect.right + window.scrollX - keyboardWidth; + + if (top < window.scrollY + 10) { + top = btnRect.bottom + window.scrollY + 10; + } + if (left < window.scrollX + 10) { + left = window.scrollX + 10; + } + if (left + keyboardWidth > window.scrollX + window.innerWidth - 10) { + left = window.scrollX + window.innerWidth - keyboardWidth - 10; + } + + keyboard.style.top = top + "px"; + keyboard.style.left = left + "px"; +} + +$(document).on("click", "#comment_emotion_btn", function (e) { + e.stopPropagation(); + var isOpen = $("#comment_emotion_btn").hasClass("comment-emotion-keyboard-open"); + if (!isOpen) { + $("#comment_emotion_btn").addClass("comment-emotion-keyboard-open"); + $("#emotion_keyboard").addClass("comment-emotion-keyboard-open"); + setTimeout(function() { + positionEmotionKeyboard(); + }, 10); + } else { + $("#comment_emotion_btn").removeClass("comment-emotion-keyboard-open"); + $("#emotion_keyboard").removeClass("comment-emotion-keyboard-open"); + } }); + $(document).on("click", ".emotion-keyboard .emotion-group-name", function () { $(".emotion-keyboard .emotion-group-name.active").removeClass("active"); $(this).addClass("active"); $(".emotion-keyboard .emotion-group:not(d-none)").addClass("d-none"); $(".emotion-keyboard .emotion-group[index='" + $(this).attr("index") + "']").removeClass("d-none"); }); + function inputInsertText(text, input) { $(input).focus(); let isSuccess = document.execCommand("insertText", false, text); @@ -2180,25 +2225,36 @@ function inputInsertText(text, input) { } $(input).focus(); } + $(document).on("click", ".emotion-keyboard .emotion-item", function () { $("#comment_emotion_btn").removeClass("comment-emotion-keyboard-open"); + $("#emotion_keyboard").removeClass("comment-emotion-keyboard-open"); if ($(this).hasClass("emotion-item-sticker")) { inputInsertText(" :" + $(this).attr("code") + ": ", document.getElementById("post_comment_content")); } else { inputInsertText($(this).attr("text"), document.getElementById("post_comment_content")); } }); + $(document).on("dragstart", ".emotion-keyboard .emotion-item > img, .comment-sticker", function (e) { e.preventDefault(); }); + document.addEventListener('click', (e) => { - if (document.getElementById("comment_emotion_btn") == null) { + if (document.getElementById("comment_emotion_btn") == null || document.getElementById("emotion_keyboard") == null) { return; } if (e.target.id != "comment_emotion_btn" && e.target.id != "emotion_keyboard" && !document.getElementById("comment_emotion_btn").contains(e.target) && !document.getElementById("emotion_keyboard").contains(e.target)) { $("#comment_emotion_btn").removeClass("comment-emotion-keyboard-open"); + $("#emotion_keyboard").removeClass("comment-emotion-keyboard-open"); } -}) +}); + +window.addEventListener('resize', function() { + if ($("#emotion_keyboard").hasClass("comment-emotion-keyboard-open")) { + positionEmotionKeyboard(); + } +}); /*查看评论编辑记录*/ function showCommentEditHistory(id) { let requestID = parseInt(new Date().getTime()); diff --git a/comments.php b/comments.php index 7d635b9..1404857 100644 --- a/comments.php +++ b/comments.php @@ -489,13 +489,15 @@ function resetGeetestCaptcha() { - + + +