鼠标悬浮导航栏显示下拉菜单

最新推荐文章于 2024-11-05 18:18:25 发布

原创

最新推荐文章于 2024-11-05 18:18:25 发布

· 6.5k 阅读

27 ·

版权

文章标签：

#前端 #jquery #javascript

本文介绍了如何通过原生JavaScript和jQuery实现鼠标悬停时导航栏显示下拉菜单的功能，强调了在使用jQuery时需要预先引入jQuery库。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在这里介绍鼠标悬停导航栏显示下拉菜单得两种方法，html和css样式就不贴代码了。

1、原生js

<script>
        // window.onload = function(){
   
            // 获取需要悬浮的对象
             let show = document.getElementById("businessarea");
             // 获取被隐藏的菜单
             let menu = document.getElementById("businessarea-menu");

             // 给show添加鼠标悬停事件
             show.onmouseover = function(){
   
                    menu.style.display = "block";
               }

              show.onmouseout = function(){