html - 使用 Jquery 的滚动菜单

Question

如何使用 Jquery 制作可滚动的菜单？

div.scrollmenu {
    background-color: #333;
    overflow: auto;
    white-space: nowrap;
}

div.scrollmenu a {
    display: inline-block;
    color: white;
    text-align: center;
    padding: 14px;
    text-decoration: none;
}

div.scrollmenu a:hover {
    background-color: #777;
}

::-webkit-scrollbar { 
   display: none; 
                   }

<div class="scrollmenu">
  <a href="#home">Home</a>
  <a href="#news">News</a>
  <a href="#contact">Contact</a>
  <a href="#about">About</a>
   <a href="#about">About</a>
    <a href="#about">About</a>
     <a href="#about">About</a>
      <a href="#about">About</a>
       <a href="#about">About</a>
        <a href="#about">About</a>
         <a href="#about">About</a>
         
  ...
</div>

我有这个水平滚动菜单，在 css 中

问题

我不希望它显示水平滚动条。

Answer 1

对于 Chrome 浏览器，您可以使用

::-webkit-scrollbar { 
    display: none; 
}

为您的 CSS。

对于更多内容，也许这对您有用。 Pure CSS Horizontal Scrolling

抱歉造成误会，这里是JS方式，HIDE VERTICAL & HORIZONTAL SCROLLBAR OF A DIV