title: jQuery IE7 problem (using jQuery Cycle plugin)
body: <p>I can't get jQuery working at all with IE7. I'm using the jQuery Cycle plugin, but I believe this problem is with jQuery (and the fact that I'm am a newbie). I'm trying to use an banner rotator, which works on Firefox, Safari and IE8. On IE7, it is not even activating... it just shows each div one after another.</p>
  
  <p>Thank you in advance!</p>
  
  <p>Example
  <a href="http://testing.observerpapers.com/lv" rel="noreferrer">http://testing.observerpapers.com/lv</a></p>
  
  <p>JS</p>
  
  <pre><code>$(document).ready(function() {
      $('#myslides')
      .before('&lt;div id="nav"&gt;')
      .cycle({
          fx: 'fade', // choose your transition type
          speedIn:  600, 
          speedOut: 600,
          timeout: 8000,
          pause: 0, // so that pauses when user hovers over a slide
          pager:  '#nav', // instructs the plugin to create navigation elements
      }); // every child element of the container becomes a slide     
  
      /*ddsmoothmenu.init({
          mainmenuid: "smoothmenu1", //menu DIV id
          orientation: 'h', //Horizontal or vertical menu: Set to "h" or "v"
          classname: 'ddsmoothmenu', //class added to menu's outer DIV
          //customtheme: ["#1c5a80", "#18374a"],
          contentsource: "markup" //"markup" or ["container_id", "path_to_menu_file"]
      });*/
  });
  </code></pre>
  
  <p>CSS</p>
  
  <pre><code>#myslides {
      width: 980px;
      height: 360px;
      /*overflow: hidden;*/
      z-index: 500;
      background:none !important;
  }
  #myslides div {
      /*background:none !important;*/
  }
  #myslides .textBlock {
      background: url(../images/home/bg-bb-textblocks.png) top left repeat;
      width: 360px;
      padding: 4px;
      margin-top: 42px;
      margin-left: 33px;
  }
  #myslides .textBlock div {
      padding: 17px 8px 10px 18px;
      border: 1px solid #756e67;
  }
  #myslides h1 {
      font: normal 24px/1.2 Helvetica, Arial, sans-serif;
      text-transform: uppercase;
      color: #fff;
      margin-bottom: 5px;
  }
  #myslides p {
      font: normal 14px/1.3 Helvetica, Arial, sans-serif;
      color: #fff;
  }
  #myslides cite {
      display: block;
      width: 500px;
      font-style: normal;
      text-transform: uppercase;
      color: #fff;
      font-size: 12px;
      position: absolute;
      bottom: 6px;
      left: 20px;
      z-index: 5000;
  }
  #myslides &gt; div {
      width: 980px;
      height: 386px;
  }
  #myslides .billBoard1 {
      background: url(../images/home/bb-kingston.jpg) top left repeat;
  }
  #myslides .billBoard2 {
      background: url(../images/home/bb-harbor-breeze.jpg) top left repeat;
  }
  #myslides .billBoard3 {
      background: url(../images/home/bb-mondrian.jpg) top left repeat;
  }
  .slides {
      margin-left: 385px;
      width: 539px;
  }
  .navBG {
      position: absolute;
      display: block;
      z-index: 500;
      bottom: 0;
      width: 980px;
      height: 30px;
      background: url(../images/home/bg-bb-textblocks.png) top left repeat;
  }
  #nav {
      position: absolute;
      z-index: 501;
      top: 356px;
      right: 10px;
      height: 30px;
      text-align: right;
  }
  #nav a:hover, #nav a.activeSlide {
      background:none repeat scroll 0 0;
      font-weight: bold;
      color: #fff;
  }
  #nav a {
      background:url("") repeat-x scroll 0 0;
      color: #d6d2cf;
      display: inline-block;
      font: 12px/18px Helvetica, Arial, san-serif;
      height: 18px;
      margin: 4px 0 0 5px;
      padding: 2px 8px;
      text-align: center;
      text-decoration: none;
  }
  #nav {
      font-size: 23px;
  }
  </code></pre>