Question

看起来jQuery在-=中对css()的处理由于某种原因在IE8中无效。以下代码没有通过任何错误，但它也不起作用。我把它缩小到上面提到的操作员。

var postCount = $(".postsWrapper .window .posts article").length;
var numberOfPages = Math.ceil(postCount / 3);
var currentPage = 1;
var transitioning = false;
$(".postsWrapper button").click(function() {
    var direction = $(this).attr("data-direction");
    var postWindowWidth = $(".postsWrapper .window").width();
    if (direction == "next" && currentPage < numberOfPages && transitioning == false) {
        transitioning = true;
        // the below line does nothing in IE8
        $(".postsWrapper .window .posts").css("marginLeft", "-=" + postWindowWidth);
        setTimeout(function() {
            transitioning = false;
        }, 1000);
        currentPage++;
    } else if (direction == "previous" && currentPage > 1 && transitioning == false) {
        transitioning = true;
        // the below line does nothing in IE8
        $(".postsWrapper .window .posts").css("marginLeft", "+=" + postWindowWidth);
        setTimeout(function() {
            transitioning = false;
        }, 1000);
        currentPage--;
    }
});

请参阅http://www.weblinxinc.com/beta/candy-controls/demo/site/index.htm

Answer 1

问题是你的margin-left属性是以值auto开头的，所以jQuery不能递增/递减它。 Live Example（来源见下文）

如果您最初将其设置为数值，它将开始工作。 Live example

这可能有资格作为jQuery错误，您可以检查their list以查看它是否存在。

以下是实例的来源：

<!DOCTYPE html>
<html>
<head>
<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
  <meta charset="utf-8">
  <title>Example</title>
</head>
<body>
  <div id="test">I'm the test div</div>
<script>
  (function() {
    "use strict";

    // The following line is only in the second example, the one that works;
    // without it, it doesn't work (in IE8) even though it does in Chrome
    $("#test").css("marginLeft", 0);

    var counter = 0;
    var up = true;
    display("Initial marginLeft: " + $("#test").css("marginLeft"));
    setInterval(function() {
      if (up) {
        $("#test").css("marginLeft", "+=5");
      } else {
        $("#test").css("marginLeft", "-=5");
      }
      ++counter;
      if (counter > 10) {
        counter =0;
        up = !up;
      }
    }, 200);

    function display(msg) {
      $("<p>").html(String(msg)).appendTo(document.body);
    }
  })();
</script>
</body>
</html>

- = jQuery的css方法中的运算符不能在IE8中运行

1 个答案: