Jquery

home.coffe

$(document).on "turbolinks:load", ->
  $('#menu_toggle').click ->
    $('#menu_side').addClass('visible')

index.html.erb

<header>
<%= link_to 'Menu', '' ,id: 'menu_toggle'%>
  <nav id="menu_side">
    <ul>
      <li><%= link_to 'Menu', ''%></li>
      <li><%= link_to 'About', ''%></li>
      <li><%= link_to 'News', ''%></li>
      <li><%= link_to 'Contact', ''%></li>
    </ul>
  </nav>
</header>

style.css

#menu_side{
  background: #151718;
  width: 200px;
  height: 100%;
  display: block;
  position: fixed;
  top: 0px;
  left: -200px;
  transition: left 0.3s linear;
}
#menu_side.visible{
  left: 0px;
}