2

我在我的项目中左侧导航左侧导航包含菜单滚动问题是,当我打开菜单时,子菜单项会显示,并且在我们必须滚动后某些项目会隐藏。所以我想在打开菜单时在顶部显示菜单显示在顶部不需要滚动用户所以如何实现;

例如 :

在此处输入图像描述

4

1 回答 1

1

您好,您可以为此使用javascriptjquery,因为您需要阅读javascriptscrollIntoView()中的方法及其工作原理。

你可以在这里查看和阅读

因此,首先您需要添加id或在您要显示class的特定内容上div

假设我有这样的 HTML 代码

<li class="treeview" id="view"> // this treeview class is for showing submenu
  <a>Menu 4</a>
  <ul>
    <li>item 1</li>
    <li>item 1</li>
    <li>item 1</li>
  </ul>
<li>

之后只需在标签中添加以下<script></script>代码

$(".treeview").click(function(e){
      setTimeout(() => {
         var element = document.getElementById(e.currentTarget.id); // e.currentTarget.id give you current id when ever you click li or div this will give you view 
         if(e.currentTarget.id){
            element.scrollIntoView({
               behavior: 'smooth', block: 'nearest', inline: 'start',
            });
         }
      }, 500);  
 }); 
于 2021-03-23T10:47:23.737 回答