tsanie/ui-lib
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

communications app, popup lib

Browse Source
This commit is contained in:
Tsanie Lily
2023-04-08 11:46:20 +08:00
parent 449196b491
commit f85d4c9903
25 changed files with 746 additions and 279 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
lib/ui/tooltip.js
View File

@ -1,18 +1,18 @@
import { createElement, createElementInit } from "../functions";
import { createElement } from "../functions";
function setTooltip(container, content) {
function setTooltip(container, content, flag = false) {
const tip = container.querySelector('.tooltip-wrapper');
if (tip != null) {
tip.remove();
}
const wrapper = createElementInit('div', wrapper => {
const wrapper = createElement('div', wrapper => {
wrapper.className = 'tooltip-wrapper tooltip-color';
wrapper.style.visibility = 'hidden';
wrapper.style.opacity = 0;
},
createElement('div', 'tooltip-pointer tooltip-color'),
createElement('div', 'tooltip-curtain tooltip-color'),
createElementInit('div', cnt => {
createElement('div', cnt => {
cnt.className = 'tooltip-content';
if (content instanceof HTMLElement) {
cnt.appendChild(content);
@ -27,32 +27,35 @@ function setTooltip(container, content) {
let tid;
container.addEventListener('mouseenter', () => {
tid && clearTimeout(tid);
tid = setTimeout(() => {
while (container?.offsetWidth == null) {
container = container.parentElement;
}
if (container == null) {
return;
}
let parent = container;
let left = container.offsetLeft;
let top = container.offsetTop;
while ((parent = parent.offsetParent) != null) {
left += parent.offsetLeft;
top += parent.offsetTop;
}
parent = container;
while ((parent = parent.parentElement) != null) {
left -= parent.scrollLeft;
top -= parent.scrollTop;
}
left -= wrapper.offsetWidth / 2 - container.offsetWidth / 2;
top -= wrapper.offsetHeight + 14;
wrapper.style.left = `${left}px`;
wrapper.style.top = `${top}px`;
wrapper.style.visibility = 'visible';
wrapper.style.opacity = 1;
}, 100);
let c = container;
while (c?.offsetWidth == null) {
c = c.parentElement;
}
if (c == null) {
return;
}
if (!flag || c.scrollWidth > c.offsetWidth) {
tid = setTimeout(() => {
let parent = c;
let left = c.offsetLeft;
let top = c.offsetTop;
while ((parent = parent.offsetParent) != null) {
left += parent.offsetLeft;
top += parent.offsetTop;
}
parent = c;
while ((parent = parent.parentElement) != null) {
left -= parent.scrollLeft;
top -= parent.scrollTop;
}
left -= wrapper.offsetWidth / 2 - c.offsetWidth / 2;
top -= wrapper.offsetHeight + 14;
wrapper.style.left = `${left}px`;
wrapper.style.top = `${top}px`;
wrapper.style.visibility = 'visible';
wrapper.style.opacity = 1;
}, 100);
}
});
container.addEventListener('mouseleave', () => {
tid && clearTimeout(tid);