CODEWITHSUNDEEP
htmlcss
joe
joe

Reputation: 219

scrollable menu with Jquery

How can I make an scrollable menu with 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>

I have this horizontal scrollable menu, in css

PROBLEM

I dont want it to show the horizontal scrollbar.

Upvotes: 1

Views: 340

Answers (1)

ukgaudram
ukgaudram

Reputation: 85

For the Chrome Browser you can use 

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

for your CSS.

And for more maybe this will work for you. Pure CSS Horizontal Scrolling

Sorry for the misunderstanding, here is a JS way, HIDE VERTICAL & HORIZONTAL SCROLLBAR OF A DIV

Upvotes: 1

Related Questions