forked from LupusNobilis/ln.vue
#2 fixed
parent
e85c00a5f3
commit
77724600d1
|
@ -65,6 +65,7 @@ div.ln-tooltip {
|
||||||
}
|
}
|
||||||
div.ln-tooltip[VISIBLE] {
|
div.ln-tooltip[VISIBLE] {
|
||||||
opacity: 1.0;
|
opacity: 1.0;
|
||||||
|
transition: opacity 300ms linear;
|
||||||
}
|
}
|
||||||
|
|
||||||
body {
|
body {
|
||||||
|
|
|
@ -18,21 +18,16 @@ function findTooltipData(el){
|
||||||
}
|
}
|
||||||
|
|
||||||
function tooltipShow(ev,tooltip){
|
function tooltipShow(ev,tooltip){
|
||||||
if (tooltipEl.parentElement)
|
if (!document.body.contains(tooltipEl))
|
||||||
document.body.appendChild(tooltipEl);
|
document.body.appendChild(tooltipEl);
|
||||||
|
|
||||||
tooltipEl.innerText = tooltip.value;
|
tooltipEl.innerText = tooltip.value;
|
||||||
tooltipEl.setAttribute("VISIBLE","");
|
tooltipEl.setAttribute("VISIBLE","");
|
||||||
|
|
||||||
tootlipVisible = true;
|
tootlipVisible = true;
|
||||||
|
|
||||||
}
|
}
|
||||||
function tooltipHide(ev,tooltip){
|
function tooltipHide(ev,tooltip){
|
||||||
tooltipEl.removeAttribute("VISIBLE");
|
tooltipEl.removeAttribute("VISIBLE");
|
||||||
setTimeout(()=>{
|
|
||||||
//document.body.removeChild(tooltipEl);
|
|
||||||
}, 600);
|
|
||||||
|
|
||||||
tootlipVisible = false;
|
tootlipVisible = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -40,19 +35,23 @@ function tooltipMouseOver(ev){
|
||||||
let tooltip = findTooltipData(ev.target);
|
let tooltip = findTooltipData(ev.target);
|
||||||
if (!tooltip)
|
if (!tooltip)
|
||||||
console.log(ev);
|
console.log(ev);
|
||||||
if (tooltip.timeout)
|
|
||||||
clearTimeout(tooltip.timeout);
|
|
||||||
if (tootlipVisible)
|
|
||||||
tooltipHide(ev,tooltip);
|
|
||||||
else
|
|
||||||
tooltip.timeout = setTimeout(() => {
|
|
||||||
tooltipShow(ev,tooltip);
|
|
||||||
}, tooltip.delay || 800);
|
|
||||||
|
|
||||||
if (tooltipEl){
|
if (tooltipEl){
|
||||||
tooltipEl.style.left = `${ev.x+3}px`;
|
tooltipEl.style.left = `${ev.x+3}px`;
|
||||||
tooltipEl.style.top = `${ev.y+3}px`;
|
tooltipEl.style.top = `${ev.y+3}px`;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
if (tooltip.timeout)
|
||||||
|
clearTimeout(tooltip.timeout);
|
||||||
|
if (tootlipVisible){
|
||||||
|
tooltip.timeout = setTimeout(() => {
|
||||||
|
tooltipHide(ev,tooltip);
|
||||||
|
}, (tooltip.delay ? (tooltip.delay / 4) : 200));
|
||||||
|
} else {
|
||||||
|
tooltip.timeout = setTimeout(() => {
|
||||||
|
tooltipShow(ev,tooltip);
|
||||||
|
}, tooltip.delay || 800);
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function tooltipMouseOut(ev){
|
function tooltipMouseOut(ev){
|
||||||
|
|
Loading…
Reference in New Issue