title: Bootstrap slider is not visable
body: <p>I am trying to use this bootstrap slider on a site I'm developing and its not displaying at all: <a href="http://seiyria.com/bootstrap-slider/" rel="nofollow">slinder</a>
  I created a plunker here to demonstrate the issue: <a href="https://plnkr.co/edit/msKlM1wYmm7QIiksuuQb" rel="nofollow">Plunker</a> Does anyone know how to fix this?</p>
  
  <pre><code>&lt;html&gt;
    &lt;head&gt;
      &lt;link rel="stylesheet" href="style.css"&gt;
    &lt;/head&gt;
  
    &lt;body&gt;
      &lt;h1&gt;Hello Plunker!&lt;/h1&gt;
      &lt;input id="ex1" data-slider-id='ex1Slider' type="text" data-slider-min="0" data-slider-max="20" data-slider-step="1" data-slider-value="14"/&gt;
      &lt;script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-slider/9.2.0/bootstrap-slider.js"&gt;&lt;/script&gt;
      &lt;script src="script.js"&gt;&lt;/script&gt;
    &lt;/body&gt; 
  &lt;/html&gt;
  </code></pre>
  
  <p>css</p>
  
  <pre><code>#ex1Slider .slider-selection {
      background: #BABABA;
  }
  </code></pre>
  
  <p>JavaScript:</p>
  
  <pre><code>var slider = new Slider('#ex1', {
      formatter: function(value) {
          return 'Current value: ' + value;
      }
  });
  </code></pre>