鼠标悬浮事件 - 技术经验

鼠标悬浮事件

来源：cnblogs　　作者：葳蕤ydp　　时间：2019/9/23 8:51:21　　对本文有异议

1.任务需求：一个按钮，一个Div，当鼠标移出按钮时，按钮显示请移入鼠标，Div隐藏，当鼠标移入时，按钮显示请移出鼠标，Div显示。

2.任务分析：监听鼠标的移入移出事件，修改元素标签的文本

3.代码实现：

<body>
 
<button id="hover">请移入鼠标</button>
 
<div style="height: 150px;width: 150px;background: coral;margin-top: 20px;" id="content"></div>
 
 
<script src="jquery-3.4.1.min.js"></script>
<script>
    $("#hover").mouseover(function () {
        $("#content").show();
        $("#hover").text("请移开鼠标");
    });
    $("#hover").mouseout(function () {
        $("#content").hide();
        $("#hover").text("请移入鼠标");
    })
</script>
</body>

原文链接：http://www.cnblogs.com/yuandanping/p/11562081.html

友情链接：直通硅谷　点职佳　北美留学生论坛

jQuery热门文章

jQuery推荐文章