查询animate()不起作用

Query animate() doesnt working

本文关键字:不起作用 animate 查询      更新时间:2023-09-26

我有以下代码:

var isOn = false;
$('.switch').on("click",function(){
  if (isOn){

    $('.toggle').animate({
      left:"18px"
    },10,"linear",
     {
      complete: function(){
        $('#label').text("ON");
      }
    });
    isOn = false;

  } else {
    $('.toggle').animate({
      left:"4px"
    }, 10,"linear",
                         {
      complete: function(){
        $('#label').text("OFF");
      }
    });
    isOn = true;
  }
});

http://codepen.io/pietrofxq/pen/LpzDE?editors=001

它是用jquery制成的开关。它在没有animate()方法的情况下工作
我用css做动画,但它在InternetExplorer中有缺陷
以下是原始效果:http://codepen.io/anon/pen/iwatp

为什么第一个链接中的完整功能不起作用?

编辑:此代码可以工作,但在IE上仍然不能正常工作

您似乎在混合.animate函数的两个不同签名。如果您将持续时间和放松直接作为参数传递,则必须对回调函数执行同样的操作:

$('.toggle').animate({left: "18px"}, 10, "linear", function(){
  $('#label').text("ON");
});

或者你必须传递两个对象:

$('.toggle').animate(
  {
     left:"18px"
  },
  {
    duration: 10,
    easing: "linear",
    complete: function(){
      $('#label').text("ON");
    }
  }
);

现在它可以工作了。请查看jsfiddle链接http://jsfiddle.net/banded_krait/da2kE/

我从你的代码中删除了一些括号和complete:数组键,希望这对你有用。