Internet Explorer 7のカルーセル問題

Question

カルーセルでは、次のJavaScriptコードが使用されています。それはmozilla、chrome、ie8でうまく動作しますが、次と前のボタンはie7では機能しません。あなたの努力のためにありがとうございます。

jQuery(function() { 
    jQuery("#cakes-carousel").each(function(){ 
     var itemWidth = 405; 
     var Container = jQuery(this); 
     var List = jQuery('ul', Container); 
     var Items = List.find('li'); 
     var Previous = jQuery('.previous a', Container); 
     var Next = jQuery('.next a', Container); 
     List.width(Items.length * itemWidth).css('position', 'relative'); 
     function CheckButtons(index) 
     { 
      if(index + 1 >= Items.length) 
      { 
       Next.parent().addClass("disabled"); 
      } 
      else{ 
       Next.parent().removeClass("disabled"); 
      } 

      if(index - 1 < 0) 
      { 
       Previous.parent().addClass("disabled"); 
      } 
      else{ 
       Previous.parent().removeClass("disabled"); 
      } 
     } 

     function GetDescriptionElement(listItem) 
     { 
      var id = listItem.attr("id"); 
      if(!id){ 
       return null; 
      } 
      return jQuery("#description-" + id.replace("carousel-",""),Container); 
     } 

     function Scroll(listItem) { 
      List.stop(); 
      var index = Items.index(listItem); 
      CheckButtons(index); 
      var left = index * itemWidth * -1; 

      var descriptionElement = GetDescriptionElement(listItem); 
      var oldDescriptionElement = GetDescriptionElement(List.find('li.active')); 

      descriptionElement.fadeIn(500); 
      if(oldDescriptionElement) 
       oldDescriptionElement.fadeOut(500); 

      List.animate({ left: left }, 500, 'swing', 
      function() { 
       List.find('li.active').removeClass('active'); 
       listItem.addClass('active'); 
      }); 
     } 

     Previous.click(function(e) { 
      e.preventDefault(); 
      if(jQuery(this).parent().hasClass("disabled")){ 
       return; 
      } 
      var item = List.find('li.active').prev(':first'); 
      if (!item.length) { 
       item = Items.filter(':last'); 
      } 
      Scroll(item); 
     }); 
     Next.click(function(e) { 
      e.preventDefault(); 
      if(jQuery(this).parent().hasClass("disabled")){ 
       return; 
      } 
      var item = List.find('li.active').next(':first'); 
      if (!item.length) { 
       item = Items.filter(':first'); 
      } 
      Scroll(item); 
     }); 

    }); 
}); 

Answer 1

私は解決策を見つけました。次のCSSが必要でした：

overflow:hidden 
position:absolute 

これは、ボタンを含むdiv用です。