title: onmouseover event to show and hide scrollbar of side menu
body: <p><img src="https://i.stack.imgur.com/SPeBB.jpg" alt="HelpImage">I want my HTML page to show the side menu scroll bar on on-mouse-over event. I can hide this side bar using below code in CSS.</p>
  
  <pre><code>.side-ul {
      height: 550px;
      cursor: pointer;
      overflow: hidden;
  }
  </code></pre>
  
  <p>but I am being unable to show it on-mouse-over event. I tried using </p>
  
  <pre><code>&lt;div onmouseover="mouseMoveFunction()"&gt;
      overflow=auto;
  &lt;/div&gt;
  function mouseOver(){
      return $("side-ul-over").start();
  }
  .side-ul-over{
      cursor: pointer;
      overflow:auto;
  } &lt;!-- This is CSS part --&gt;
  </code></pre>
  
  <p>I am very new to HTML and CSS. Any help would be appreciated.</p>
  
  <pre><code>nav.sidebar {
      position: fixed;
      top: 0px;
      left: 0px;
      height: 100%;
      background: none repeat scroll 0 0 #0099ff;
      color: white;
      padding: 20px 10px;
  
  }
  </code></pre>