Question

我的第一个网站工作正常，但我有一个想法，我不知道如何完成。某些页面有一个视频播放器，其中包含选择视频的按钮。当鼠标悬停在按钮上时，导航菜单将替换为描述视频的弹出文本区域。 http://www.churchprojectionist.com/nt_history.html

我希望弹出文本显示在鼠标悬停的按钮上方几行，因此观看者的眼睛不必来回移动。我看了，但没有发现任何迹象表明如何做到这一点。我见过的最接近的事情是使用<span> title属性来创建鼠标悬停工具提示。也许你可以指出我正确的方向？

Answer 1

试试这个：

$(document).on("mousemove",function(e){

    $(".moveTxt").css({top:e.pageY,left:e.pageX});

})

最终代码：

＆＃13;

<!DOCTYPE html>
<html lang="en">
<head>
    <style>
        .moveTxt {
            position: relative;
            background-color: yellow;
            display: inline-block;
            border: 1px solid red;
        }
    </style>
</head>
    
    <body>
        
        <div class="moveTxt">Text</div>
        
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
        <script>
            
        $(document).on("mousemove",function(e){

            $(".moveTxt").css({top:e.pageY,left:e.pageX});

        })
        
        </script>
    </body>
</html>

＆＃13;

有没有办法让文字区跟随鼠标？

1 个答案: