1

我有一张图片，当 jQuery 加载时，它会向右旋转 90 度。单击图像后，我想旋转 180 度，总共旋转 270 度。

再次单击它后，我将添加另一个将其旋转回来的功能，但我不能这样做，直到我可以停止从 0 度开始的旋转。

JSFddle

$('#Options').click(
function () {
    //$(this).stop().animate({ 'padding-left': (GetCLWidth) });
    $('.Options_open').animate({ 90:borderSpacing: 180 }, {
        step: function (currentStep) {
            $(this).css('transform', 'rotate('+ currentStep +'deg)');
            $(this).css('-ms-transform', 'rotate(' + currentStep + 'deg)');
            $(this).css('-webkit-transform', 'rotate(' + currentStep + 'deg)');
        },
        duration: 2500
    }, 'linear');
});
4

1 回答 1

0

我建议您执行以下操作之一：

  • 在第一个函数完成后，您设置另一个类以在第一个函数执行后将图像定位/旋转到其最后一帧，然后从那里开始将其移回原始位置，然后触发其第一类；

  • 或者你可以有一个布尔变量来检查它是否已经被点击，如果它已经被点击，启动一个 .css 将它旋转 180 度，然后将它旋转回它的第一个位置，但不要忘记在完成后重置布尔变量那个，所以你可以在两个动画功能中一遍又一遍地检查它

此外，由于您使用的是 CSS3 过渡，您应该为缺少的浏览器提供一些功能，请在此处查看

于 2013-05-03T14:19:41.177 回答