title: Why is this simple content slider not working?
body: <p>I am currently trying to implement <a href="http://bxslider.com/examples/auto-show-start-stop-controls" rel="nofollow">THIS</a> very simple content slider however it is not working. Can somebody please tell me what I have done wrong here as I am at a loss.</p>
  
  <p>My current code is below.</p>
  
  <pre><code>&lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;Untitled Document&lt;/title&gt;
   &lt;!-- jQuery library (served from Google) --&gt;
  &lt;script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"&gt;&lt;/script&gt;
  &lt;!-- bxSlider Javascript file --&gt;
  &lt;script src="jquery.bxslider.min.js"&gt;&lt;/script&gt;
  &lt;!-- bxSlider CSS file --&gt;
  &lt;link href="jquery.bxslider.css" rel="stylesheet" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;script type="text/javascript"&gt;
   $(document).ready(function(){
  
  $('.bxslider').bxSlider({
  auto: true,
  });
  });
  &lt;/script&gt;
  
  &lt;div class="slider"&gt;
  &lt;ul class="bxslider"&gt;
  &lt;li&gt;&lt;img src="images/slide1.png" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/slide2.png" /&gt;&lt;/li&gt;
  &lt;li&gt;&lt;img src="images/slide3.png" /&gt;&lt;/li&gt;
  &lt;/ul&gt;&lt;/div&gt;
  
  &lt;/body&gt;
  </code></pre>
  
  <p>The console errors that I am getting are:</p>
  
  <p>1.
  Failed to load resource: net::ERR_FILE_NOT_FOUND file://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js</p>
  
  <p>2.
  Uncaught ReferenceError: jQuery is not defined jquery.bxslider.min.js:10</p>
  
  <p>3.
  Uncaught ReferenceError: $ is not defined other.html:16</p>