diff --git a/app/src/block/popover.ts b/app/src/block/popover.ts index 93e88eba1..80766f44e 100644 --- a/app/src/block/popover.ts +++ b/app/src/block/popover.ts @@ -81,19 +81,20 @@ export const initBlockPopover = (app: App) => { } } let tooltipSpace: number | undefined; - if (!tip) { + if (!tip && aElement.getAttribute("data-type") === "inline-memo") { tip = escapeHtml(aElement.getAttribute("data-inline-memo-content")); - if (tip) { - tooltipClass = "memo"; // 为行级备注添加 class https://github.com/siyuan-note/siyuan/issues/6161 - tooltipSpace = 0; // tooltip 和备注元素之间不能有空隙 https://github.com/siyuan-note/siyuan/issues/14796#issuecomment-3649757267 - } + tooltipClass = "memo"; // 为行级备注添加 class https://github.com/siyuan-note/siyuan/issues/6161 + tooltipSpace = 0; // tooltip 和备注元素之间不能有空隙 https://github.com/siyuan-note/siyuan/issues/14796#issuecomment-3649757267 } if (!tip) { + if (aElement.getAttribute("data-type") === "a") { + tooltipClass = "href"; // 为超链接添加 class https://github.com/siyuan-note/siyuan/issues/11440#issuecomment-2119080691 + tooltipSpace = 0; + } const href = aElement.getAttribute("data-href") || ""; // 链接地址强制换行 https://github.com/siyuan-note/siyuan/issues/11539 if (href) { tip = `${href.substring(0, Constants.SIZE_TITLE)}`; - tooltipClass = "href"; // 为超链接添加 class https://github.com/siyuan-note/siyuan/issues/11440#issuecomment-2119080691 } const title = aElement.getAttribute("data-title"); if (tip && isLocalPath(href) && !aElement.classList.contains("b3-tooltips")) { @@ -106,7 +107,7 @@ export const initBlockPopover = (app: App) => { } else { assetTip += ` ${response.data.hSize}${title ? '
' + title + "" : ""}
${window.siyuan.languages.modifiedAt} ${response.data.hUpdated}
${window.siyuan.languages.createdAt} ${response.data.hCreated}`; } - showTooltip(assetTip, aElement, tooltipClass); + showTooltip(assetTip, aElement, tooltipClass, event, tooltipSpace); }); tip = ""; } else if (title) { diff --git a/app/src/dialog/tooltip.ts b/app/src/dialog/tooltip.ts index b81598eb2..5b73aaa3b 100644 --- a/app/src/dialog/tooltip.ts +++ b/app/src/dialog/tooltip.ts @@ -1,16 +1,22 @@ import {isMobile} from "../util/functions"; -export const showTooltip = (message: string, target: Element, tooltipClass?: string, event?: MouseEvent, space: number = 0.5) => { - if (isMobile()) { +export const showTooltip = ( + message: string, + target: Element, + tooltipClass?: string, + event?: MouseEvent, + space: number = 0.5 +) => { + if (isMobile() || !message) { return; } let targetRect = target.getBoundingClientRect(); // 跨行元素 - const clientRects = target.getClientRects(); + const clientRects = Array.from(target.getClientRects()); if (clientRects.length > 1) { if (event) { - // 选择包含鼠标的矩形 - Array.from(clientRects).forEach(item => { + // 选择鼠标附近的矩形 + clientRects.forEach(item => { if (event.clientY >= item.top - 3 && event.clientY <= item.bottom) { targetRect = item; } @@ -18,7 +24,7 @@ export const showTooltip = (message: string, target: Element, tooltipClass?: str } else { // 选择宽度最大的矩形 let lastWidth = 0; - Array.from(clientRects).forEach(item => { + clientRects.forEach(item => { if (item.width > lastWidth) { targetRect = item; } @@ -26,11 +32,10 @@ export const showTooltip = (message: string, target: Element, tooltipClass?: str }); } } - if (targetRect.height === 0 || !message) { + if (targetRect.height === 0) { hideTooltip(); return; } - const messageElement = document.getElementById("tooltip"); messageElement.className = tooltipClass ? `tooltip tooltip--${tooltipClass}` : "tooltip"; messageElement.innerHTML = message;