Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
1.1k views
in Technique[技术] by (71.8m points)

swiper自定义进度条消失时怎么立即除去它的过渡动画

我看了,这位老哥的解决办法,自己写了一个,每次0~100 4秒是没问题,但是我每次除去class,它会100~0也走四秒,除去class能否立刻去除呢,谢谢各位

//js
var swiper = new Swiper('.swiper-container', {
    ...
    autoplay: 4000,
    onSlideChangeStart: function(swiper) {
        let dom = document.querySelector('#progress-content');
        dom.classList.toggle('progress-100');
        
    }
});
//进度条
        .progress {
            position: absolute;
            bottom: 200PX;
            right: 200PX;
            z-index: 99;
            width: 205PX;
            height: 6PX;
            background-color: #524847;
            .progress-bar{
                height: 6PX;
                width: 0%;
                background-color: #ffffff;
                transition-property:width;
                transition-duration:4s;
                -webkit-transition-property:width;
                -webkit-transition-duration:4s;
                
            }
            .progress-100{
                width: 100%;
            }
        }

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Reply

0 votes
by (71.8m points)
等待大神解答

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
OGeek|极客中国-欢迎来到极客的世界,一个免费开放的程序员编程交流平台!开放,进步,分享!让技术改变生活,让极客改变未来! Welcome to OGeek Q&A Community for programmer and developer-Open, Learning and Share
Click Here to Ask a Question

...