Question

我在JQuery中使用animate函数来放大/缩小图像上的功能。它适用于除Internet Explorer之外的所有浏览器。下面是代码片段，我使用的是jquery-1.2.3.min.js。

我非常感谢您解决此问题的任何帮助。提前谢谢！

HTML：

<div class="mapImage">
    <p>
       <a href="#" id="zoomIn" class="in">Zoom In</a> 
       <a href="#" id="zoomOut" class="out">Zoom Out</a>
    </p>
    <div class="photo">
       <img alt="photo_map" id="pathwayImage" style="width:630px;height:1176px;" src="images/pathwayimage.jpg">
    </div>
</div>

JQuery的：

$('a#zoomIn').click(function() {
  $('#pathwayImage').animate({
      width:950,
      height:1773,
  }, 500, function() {
  // Animation complete.
  });
});
$('a#zoomOut').click(function() {
  $('#pathwayImage').animate({
      width:630,
      height:1176,
  }, 500, function() {
    // Animation complete.
  });
});
});

Answer 1

$('a#zoomIn').click(function() {
  $('#pathwayImage').animate({
    width:'950px',
    height:'1773px',
  }, 500, function() {
  // Animation complete.
});
});
$('a#zoomOut').click(function() {
  $('#pathwayImage').animate({
    width:'630px',
    height:'1176px',
  }, 500, function() {
    // Animation complete.
  });
});
});

您需要提供包含px的字符串的新尺寸。有些浏览器会接受int，但不接受IE。

Answer 2

删除逗号至少在IE9中起到了作用。

Demo

这是最终的jQuery：

$('a#zoomIn').click(function() {
    $('#pathwayImage').animate({
        width: 950,
        height: 1773
    }, 500, function() {
        // Animation complete.
    });
});
$('a#zoomOut').click(function() {
    $('#pathwayImage').animate({
        width: 630,
        height: 1176
    }, 500, function() {
        // Animation complete.
    });
});

Jquery animate（）函数不适用于IE

2 个答案: