jQuery事件-div的显示隐藏及鼠标的移入移出

最新推荐文章于 2023-04-06 11:08:36 发布

高风言

最新推荐文章于 2023-04-06 11:08:36 发布

阅读量819

点赞数

分类专栏： JavaWeb学习汇总文章标签： JQuery javascript

本文链接：https://blog.csdn.net/gaofengyan/article/details/86473551

版权

本文探讨了如何使用jQuery实现div元素的显示和隐藏效果，并详细讲解了鼠标移入移出事件的绑定及应用，为网页交互增添动态体验。

摘要由CSDN通过智能技术生成

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
<html>  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">  
<title>jQuery事件-div的显示隐藏及鼠标的移入移出</title>  
<style>  
.header{  
    width:302px;  
    height:40px;  
    background:green;  
    font-size:20px;  
    margin-bottom: 0px;  
}  
.content{  
    width:300px;  
    border:1px solid #333;  
    background:#CCC;  
    display: none;  
    margin-top:0px;  
}  
</style>  
</head>  
<script type="text/javascript" src="jquery-1.11.1.js"></script>  
<script type="text/javascript">  
    $(function (){  
        //显示隐藏  
        $(".header").click(function (){  
            var flag = $(".content").is(":hidden");  
            i

最低0.47元/天解锁文章