javascript-如何在jQuery Transit中暂停和重新启动css3过渡

我正在使用jquery运输来移动和元素.我想暂停动画,然后单击按钮继续播放.但是我不知道该怎么做.

JSFiddle：http://jsfiddle.net/b4hwq/2/

我确实尝试过

stop().transition({});

但它抛出一个错误.

解决方法:

使用.stop()时,您的工作大部分都已结束.我只是添加了一点逻辑,以告诉它停止时该怎么办.

Working Example

$('button').click(function () {
    if (!$('.box').hasClass('stop')) { // if the box does not have class "stop"
        $('.box').stop().transition({  // stop the transition
            x: $('.box').offset().left + $('.box').width() / 2  // where the box should be when it stops
        }, 1).addClass('stop'); // simple add class for easy button control  
    } else { // if the box has class "stop"
        $('.box').transition({
            x: '350px' 
        }, 5000).removeClass('stop'); // continue with regularly scheduled programming then remove "stop"
    }
});

标签：css3,css-transitions,javascript,jquery,jquery-transit
来源： https://codeday.me/bug/20191122/2060786.html