问一个屏幕滚动的问题

页面div容器有两层
大致如下页面格局

<html>
    <head>
        <style>
        /*头部和底部bar*/
        .top_bar{position:fixed;top:0px;height:40px; }
        .botton_bar{ position:fixed;button:0px;height:80px;}
        
        /*一些工具区域,这事一个点击底部bar,某个按钮弹出来的页面层,希望工具比较多的时候显示滑条
         *可惜是手机端和pc存在,滑动事件冒泡问题,下拉时center也在动
         *以及pc端出现比较恶心滑条很难看
         *想继续保持,页面内容比较多*/
        .panel{ height:100vh; overflow:scroll;  }
        
        /*正常的内容区域*/
        .center{ min-height:100000px;}
        </style>
    </head>
<body>
    <div class="container">
        <div class="top_bar"></div>
        <div class="panel">
            <ul>
                <li>.........</li>
                <li>.........</li>
                <li>.........</li>
                <li>.........</li>
            </ul>
        </div>
        
        <div class="center">
            <p>
            .....................
            </p>
            
        </div>
        <div class="botton_bar"></div>
    </div>
</body>
</html>

问题是解决页面工具区,事件冒泡,希望不通过js. 调整页面结构来解决问题

阅读 1.6k
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题