title: JQuery Slideshow error. Pictures list down the page instead of shuffling. Can't find the error
body: <p>Okay so i've been coding a website for my friend and I had everything working and almost ready to publish. But I may have altered something along the way and screwed up the syntax. It could be something as small as a semi-colon (i've searched so it's not that :]). I didnt want to have to ask for your help but I'm stuck. Please assist. </p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html lang='en'&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8" /&gt;
          &lt;meta name="description" content="The Sweetest Sin" /&gt;
          &lt;meta name ="keywords" content = "bakery, sweetestsin, sweetest sin" /&gt;
          &lt;title&gt;The Sweetest Sin&lt;/title&gt;
  
          &lt;!-- include jQuery library --&gt;
          &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"&gt;&lt;/script&gt;
          &lt;!-- include Cycle plugin --&gt;
          &lt;script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"&gt;&lt;/script&gt;
          &lt;script type="text/javascript"&gt;
              $(document).ready(function () {
                  $('.slideshow').cycle({
                      fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
                  });
              });
          &lt;/script&gt;
  
          &lt;link href="css/style.css" rel="stylesheet" type="text/css" /&gt;
          &lt;link href="css/main.css" rel="stylesheet" type="text/css" /&gt;
          &lt;!--[if lt IE 9]&gt;
          &lt;script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"&gt;&lt;/script&gt;
          &lt;![endif]--&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;div id="wrapper"&gt;
              &lt;header&gt;
                  &lt;h1&gt; &lt;a href="index.html"&gt; The Sweetest Sin &lt;/a&gt;&lt;/h1&gt;
                  &lt;ul id="nav"&gt;
                      &lt;li id ="active"&gt;&lt;a href="index.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="flavors.html"&gt;Flavors/Fillings&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="gallery.html"&gt;Gallery&lt;/a&gt;&lt;/li&gt;
                      &lt;li&gt;&lt;a href="contact.html"&gt;Contact Us&lt;/a&gt;&lt;/li&gt;
                  &lt;/ul&gt; &lt;!-- End Nav --&gt;
              &lt;/header&gt;   &lt;!-- End Header --&gt;
              &lt;div id="banner"&gt; &lt;/div&gt;
              &lt;div class="clearfix"&gt;
                  &lt;div id="social-media-icons"&gt; 
                      &lt;a href="https://facebook.com" target="_blank"&gt; &lt;img   src="images/facebook.png" /&gt; &lt;/a&gt;
                      &lt;a href="https://twitter.com" target="_blank"&gt; &lt;img src="images/twitter.png" /&gt; &lt;/a&gt;
                  &lt;/div&gt; &lt;!--end social --&gt;
  
                  &lt;div class="left"&gt;
                      &lt;div class="canvas"&gt;
                          &lt;div class="slideshow"&gt;
                              &lt;img src="images/image0.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image1.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image2.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image2.5.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image3.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image3.5.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image4.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image4.5.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image5.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image5.5.jpg" width="500" height="350" /&gt;      
                              &lt;img src="images/image6.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image6.5.jpg" width="500" height="350" /&gt;
                              &lt;img src="images/image7.jpg" width="500" height="350" /&gt; 
                          &lt;/div&gt;  &lt;!-- End Slideshow --&gt;
                      &lt;/div&gt; &lt;!-- End Canvas --&gt;
                  &lt;/div&gt; &lt;!-- End Left --&gt;
  
                  &lt;div class="right"&gt;
  
                      &lt;img src="images/thechef.png"/&gt;
                      &lt;h3&gt;Welcome to the bakery&lt;/h3&gt;
                      &lt;p&gt;The Bakery is now open!&lt;/p&gt;
                  &lt;/div&gt; &lt;!-- End Right --&gt;
              &lt;/div&gt;
              &lt;footer&gt;
                  &lt;p&gt;&amp;copy;2012 TheSweetestSin.net&lt;/p&gt;
              &lt;/footer&gt; &lt;!-- End Footer --&gt;
          &lt;/div&gt; &lt;!-- End Wrapper --&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>