Question

我需要一些JavaScript帮助，如果我将鼠标移到某些文本上，这将帮助我在div元素内创建一个悬停在文本描述上。这个描述将跟随我移动鼠标的鼠标。从文本中删除鼠标后，将鼠标悬停在文本上将消失。所有这些都需要在纯JavaScript的帮助下完成，而不是JQUERY。

谢谢

Answer 1

这是基本原则：

<!DOCTYPE html>
<html>
<head>
<script>
function moveDescrip(event)
{
    var d = document.getElementById("descrip")
    var x=event.clientX;
    var y=event.clientY;
    d.style.top = y + "px";
    d.style.left = x + "px";
}
function showDescrip(show)
{
   var d = document.getElementById("descrip");
   d.style.visibility=show ? "visible" : "hidden";
}
</script>
</head>

<body>

<div 
    onmouseover="showDescrip(true)" 
    onmouseout="showDescrip(false)" 
    onmousemove="moveDescrip(event)" 
    style="border: 1px solid black; width: 200px; height:300px" >
    Description div will follow your mouse while you hover over.        
</div>

<div id="descrip" style="position:absolute; visibility:hidden">description</div>

</body>
</html>

将鼠标悬停在说明Javascript上

1 个答案: