首页HBuilder制作一个鼠标感应程序，当鼠标进到页面上某段文字时，弹出提示框。

HBuilder制作一个鼠标感应程序，当鼠标进到页面上某段文字时，弹出提示框。

时间: 2023-08-14 21:06:01 浏览: 94

你可以使用以下代码实现这个功能： ```html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Mouseover Text Popup</title> <style> .popup { display: none; position: absolute; background-color: #fff; border: 1px solid #ccc; padding: 10px; z-index: 9999; } </style> </head> <body> <p>当鼠标移动到这段文字上时，会弹出提示框。</p> <div class="popup"></div> <script> var popup = document.querySelector('.popup'); var text = document.querySelector('p'); text.addEventListener('mouseover', function() { popup.innerHTML = '这是提示框的内容。'; // 设置提示框的内容 popup.style.display = 'block'; // 显示提示框 popup.style.left = event.clientX + 'px'; // 设置提示框的位置 popup.style.top = event.clientY + 'px'; }); text.addEventListener('mouseout', function() { popup.style.display = 'none'; // 隐藏提示框 }); </script> </body> </html> ``` 这段代码会在页面上创建一个段落和一个空的 `<div>` 元素，并在鼠标移到段落上时显示提示框。当鼠标移出段落时，提示框会隐藏。你可以根据需要修改 `<p>` 元素中的文本和提示框的内容。

阅读全文