Jquery animation 在 IE7 中不工作

Question

我正在完成一個站點，並正在努力使其與 ie7 兼容，但是有一個基本腳本可以向上/向下移動 3 個選項卡，但它一直無法正常工作。 代碼如下。

 $(document).ready(function() {
     $('.lower').click(function() {

    $('#range-dropdown').animate({
    top: '315',
  }, 2000, function() {});
  $('#range-dropdown2').animate({
    top: '0',
  }, 2000, function() {});
      $('#range-dropdown3').animate({
    top: '0',
  }, 2000, function() {});
      $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
      $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});
   });


   $('.lower1').click(function() {
   $('#range-dropdown2').animate({
    top: '315',
  }, 2000, function() {});
      $('#range-dropdown').animate({
    top: '0',
  }, 2000, function() {});
      $('#range-dropdown3').animate({
    top: '0',
  }, 2000, function() {});
     $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
        $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});


    });

  $('.lower2').click(function() {
  $('#range-dropdown3').animate({
    top: '315',
  }, 2000, function() {});
    $('#range-dropdown').animate({
    top: '0',
  }, 2000, function() {});
    $('#range-dropdown2').animate({
    top: '0',
  }, 2000, function() {});
    $('.rangelist-container').animate({
    top: '715',
  }, 2000, function() {});
        $('#dropdown-holder').animate({
    marginBottom: '120px',
  }, 2000, function() {});


  });
 });

任何幫助將不勝感激

*所有 css 值都在樣式表中聲明。

Answer 1

您到處都有雜散的尾隨逗號，例如：

$('#range-dropdown').animate({
    top: '315', // <----------------- Right here
}, 2000, function() {});

刪除它們，使其看起來像這樣：

$('#range-dropdown').animate({
    top: '315'
}, 2000, function() {});

IE7 對那些尾隨的逗號感到不安，但大多數其他瀏覽器讓它滑動和 DWIM（按我的意思做）而不是抱怨。

Answer 2

嘗試明確說明單位。 你說的是'315' ，但那是什么單位？ 腳？ 米？ 厘米？ 使用'315px' ，因為它明確說明了單位。

此外，您不需要一遍又一遍地編寫function() {} 。 完全省略它。