Sidebar, wich comes out if the mouse is moved to the edge of the screen

index.html

<div id="sidebar-holder">
<div>

script.js

var s = {}
s.win = window.innerWidth
s.switcher = { new: 0, old: 0 }

s.sideBarWidth = $('#sidebar-holder').css('width')
$('#sidebar-holder').css('left', '-' + s.sideBarWidth)
$(document).mousemove(mouseSidebar)

function mouseSidebar(e) {
  s.switcher.old = s.switcher.new

  if(e.clientX < s.win * .15) { s.switcher.new = 1 }
  if(e.clientX > s.win * .25) { s.switcher.new = 0 }

  if(s.switcher.new === 1 && s.switcher.new !== s.switcher.old) {
    d3.select('#sidebar-holder')
      .transition()
      .duration(300)
      .style('left', '0px')
    }
  
  if(s.switcher.new === 0 && s.switcher.new !== s.switcher.old) {
    d3.select('#sidebar-holder')
      .transition()
      .duration(300)
      .style('left', '-' + s.sideBarWidth)
    }
}

style.css

#sidebar-holder {
  height: 100%;
  width: 25%;
  position: fixed;
  top: 0;
  left: 0;
  /*background: rgba(242, 242, 242, 0.97);*/
  background: white;
  z-index: 100;
}