|
@@ -83,4 +83,72 @@ Vue.directive("title", {
|
|
|
el.addEventListener("dragover", removeTitle);
|
|
|
el.addEventListener("dragleave", removeTitle);
|
|
|
},
|
|
|
+ update: function (el, binding) {
|
|
|
+ removeTitle();
|
|
|
+ if (!binding.value) {
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ el.addEventListener(
|
|
|
+ "mousemove",
|
|
|
+ function (e) {
|
|
|
+ if (!isShowTitle) {
|
|
|
+ clearTimeout(timerId);
|
|
|
+ timerId = setTimeout(() => {
|
|
|
+ isShowTitle = true;
|
|
|
+
|
|
|
+ titleNode = document.createElement("div");
|
|
|
+
|
|
|
+ titleNode.style.position = "fixed";
|
|
|
+ titleNode.style.zIndex = 2147483647;
|
|
|
+ titleNode.style.backgroundColor = "#191A1C";
|
|
|
+ titleNode.style.borderRadius = "2px";
|
|
|
+ titleNode.style.border = "1px solid rgba(151, 151, 151, 0.2)";
|
|
|
+ titleNode.style.padding = "2px 6px";
|
|
|
+ titleNode.style.fontSize = "12px";
|
|
|
+ titleNode.style.color = "rgba(255, 255, 255, 0.6)";
|
|
|
+ titleNode.innerText = binding.value;
|
|
|
+ titleNode.style.left = e.clientX + 11 + "px";
|
|
|
+ titleNode.style.top = e.clientY + 18 + "px";
|
|
|
+
|
|
|
+ document.body.appendChild(titleNode);
|
|
|
+
|
|
|
+ if (
|
|
|
+ e.clientX + 11 + titleNode.offsetWidth >
|
|
|
+ document.documentElement.clientWidth
|
|
|
+ ) {
|
|
|
+ titleNode.style.left =
|
|
|
+ document.documentElement.clientWidth -
|
|
|
+ titleNode.offsetWidth +
|
|
|
+ "px";
|
|
|
+ }
|
|
|
+ if (
|
|
|
+ e.clientY + 18 + titleNode.offsetHeight >
|
|
|
+ document.documentElement.clientHeight
|
|
|
+ ) {
|
|
|
+ titleNode.style.top =
|
|
|
+ document.documentElement.clientHeight -
|
|
|
+ titleNode.offsetHeight +
|
|
|
+ "px";
|
|
|
+ }
|
|
|
+
|
|
|
+ intervalId = setInterval(() => {
|
|
|
+ if (!document.contains(el)) {
|
|
|
+ removeTitle();
|
|
|
+ }
|
|
|
+ }, 300);
|
|
|
+ }, 500);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ {
|
|
|
+ passive: false,
|
|
|
+ }
|
|
|
+ );
|
|
|
+
|
|
|
+ el.addEventListener("mouseleave", removeTitle);
|
|
|
+ el.addEventListener("mousedown", removeTitle);
|
|
|
+ el.addEventListener("keydown", removeTitle);
|
|
|
+ el.addEventListener("scroll", removeTitle);
|
|
|
+ el.addEventListener("dragover", removeTitle);
|
|
|
+ el.addEventListener("dragleave", removeTitle);
|
|
|
+ },
|
|
|
});
|