title: jquery image slider not sliding?
body: <p>The blueberry Image slider isnt sliding, here is the java script code please help me modify or add enough code so that it will work properly. I have linked the blueberry.css and jquery.blueberry.js files too btw.  thank you - student of web development</p>
  
  <pre><code>&lt;meta charset="UTF-8"&gt;&lt;/meta&gt;
  &lt;title&gt;Rose Street | Auto Repair&lt;/title&gt;
  &lt;meta name="viewport" content="width=device-width, initail-scale=1.0"&gt;&lt;/meta&gt;
  &lt;link rel="stylesheet" href="main.css"&gt;&lt;/link&gt;
  &lt;link rel="stylesheet" href="font-awesome.css"&gt;&lt;/link&gt;
  &lt;link rel="stylesheet" href="blueberry.css"&gt;&lt;/link&gt;
  &lt;link rel="stylesheet" href="style2.css"&gt;&lt;/link&gt;
  &lt;link rel="stylesheet" id="google-fonts-css" href="//fonts.googleapis.com/css?family=Open+Sans%3A400%2C400italic%2C300italic%2C300%2C600%2C600italic%7CLato%3A400%2C100%2C300%2C700&amp;amp;ver=4.0.5" type="text/css" media="all"&gt;&lt;/link&gt;
  
  &lt;script src="https://apis.google.com/js/platform.js"&gt; async defer&gt;&lt;/script&gt;
  &lt;script type="text/javascript" src="jquery-1.11.2.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js"&lt;/script&gt;
  &lt;script src="jquery.blueberry.js"&gt;&lt;/script&gt;
  &lt;script&gt;
      $(window).load(function() {
          $('.blueberry').blueberry();
      });
  &lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      function Scroll(){
          var top = document.getElementById('header');
          var ypos = window.pageYOffset;
          if(ypos &lt; 700) {
              top.style.opacity = ".9";
              top.style.height= "86px"
          }else{
              top.style.opacity = ".5";
              top.style.height= "100px"
          }
      }
      window.addEventListener("scroll",Scroll);
  &lt;/script&gt;
  &lt;script type="text/javascript"&gt;
      $(function(){
          $("#header").fadeToggle(1).delay(2000).fadeToggle(2000);
          $("#logo").fadeToggle(1).delay(2000).fadeToggle(2000);
          $("nav").fadeToggle(1).delay(2500).slideToggle(1000);
      });
  &lt;/script&gt;
  </code></pre>
  
  <p><strong>HTML:</strong></p>
  
  <pre><code>&lt;div id="doc"&gt;
      &lt;div id="content"&gt;
          &lt;div class="blueberry"&gt;
              &lt;ul class="slides"&gt;
                  &lt;li class="" style="display: inline;"&gt;
                      &lt;img src="http://ultraimg.com/images/93ee8dce5462.jpg" alt="slide1"&gt;
                  &lt;/li&gt;
                  &lt;li class="active" style="display: inline;"&gt;
                      &lt;img src="http://ultraimg.com/images/85173643ed34.jpg" alt="slide2"&gt;
                  &lt;/li&gt;
                  &lt;li class="" style="display: none;"&gt;
                      &lt;img src="http://www.thehogring.com/wp-content/uploads/2012/11/The-Hog-Ring-Auto-Upholstery-Community-Auto-Trimmer-History-11.jpg" alt="slide3"&gt;
                  &lt;/li&gt;
                  &lt;li class="" style="display: none;"&gt;
                      &lt;img src="http://theoldmotor.com/wp-content/uploads/2013/11/Euclid1-600x351.jpg" alt="slide4"&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
              &lt;ul class="pager"&gt;
                  &lt;li class=""&gt;
                      &lt;a href="#"&gt;&lt;span&gt;0&lt;/span&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class=""&gt;
                      &lt;a href="#"&gt;&lt;span&gt;1&lt;/span&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class=""&gt;
                      &lt;a href="#"&gt;&lt;span&gt;2&lt;/span&gt;&lt;/a&gt;
                  &lt;/li&gt;
                  &lt;li class="active"&gt;
                      &lt;a href="#"&gt;&lt;span&gt;3&lt;/span&gt;&lt;/a&gt;
                  &lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>