js实现菜单列表滚动条（鼠标滚轮事件）

最新推荐文章于 2023-12-04 11:29:51 发布

xiaodanda

最新推荐文章于 2023-12-04 11:29:51 发布

阅读量752

点赞数

文章标签： javascript 前端 html layui css

本文链接：https://blog.youkuaiyun.com/xiaodanda/article/details/125917641

版权

本文介绍了如何使用JavaScript配合HTML和CSS，实现菜单列表的滚动条功能，特别是结合鼠标滚轮事件，创建流畅的用户体验。

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

//html代码
<div class="layui-panel" id="wrap" style=" height: 130px;   width: 300px;  position: relative; /*超出隐藏*/ overflow: hidden;  " >
  <ul class="layui-menu" id="docDemoMenu1" style=" width: 300px;  position: absolute; left: 0; top: 0;  ">
    <li lay-options="{id: 100}">
      <div class="layui-menu-body-title" style=" width: 294px;   vertical-align: top;  height: 30px;  text-align: center;  line-height: 30px; " >列表111</div>
    </li>
    <li lay-options="{id: 101}">
       <div class="layui-menu-body-title" style=" width: 294px;   vertical-align: top;  height: 30px;  text-align: center;  line-height: 30px; ">列表222</div>
    </li>
     <li