亚洲中字慕日产2020,大陆极品少妇内射AAAAAA,无码av大香线蕉伊人久久,久久精品国产亚洲av麻豆网站

資訊專欄INFORMATION COLUMN

關(guān)于特定位置進(jìn)度條的加載

Godtoy / 2012人閱讀

摘要：群里的朋友提問了個(gè)問題有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸，不讓用動(dòng)畫實(shí)現(xiàn)，，想了想，開工了。。好了，代碼大概是這樣

群里的朋友提問了個(gè)問題：
有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸0，不讓用css3動(dòng)畫實(shí)現(xiàn)，so，想了想，開工了。。
html:

css:

.main{
    width:1000px;
    margin:0 auto;
}
.main .block{
    width:100%;
    height:500px;
    background-color:yellow;
    margin-bottom:20px;
}
.main .progress{
    width:50%;
    height:50px;
    margin:0 auto;
    border:1px solid #ebebeb;
}
.main .progress .progressItem{
    background-color:green;
    width:0;
    height:50px;
}

js:

$(window).scroll(function(){
    if(($(window).scrollTop()+$(window).height())>$(".progress").offset().top){
        if(($(window).scrollTop()<$(".progress").offset().top+$(".progress").height())){
            $(".progressItem").animate({
                width:"100%",
            },5000);
        }else{
            $(".progressItem").stop(true,true).css("width","0px");
        }    
    }else{
        $(".progressItem").stop(true,true).css("width","0px");
    }
});

好了，代碼大概是這樣~

文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉(zhuǎn)載請(qǐng)注明本文地址：http://www.ezyhdfw.cn/yun/111493.html

相關(guān)文章

  • 關(guān)于特定位置進(jìn)度條的加載

    摘要：群里的朋友提問了個(gè)問題有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸，不讓用動(dòng)畫實(shí)現(xiàn)，，想了想，開工了。。好了，代碼大概是這樣 群里的朋友提問了個(gè)問題：有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸0，不讓用css3動(dòng)畫實(shí)現(xiàn)，so，想了想，開工了。。html: ...

    changfeng1050 評(píng)論0 收藏0

  • 關(guān)于特定位置進(jìn)度條的加載

    摘要：群里的朋友提問了個(gè)問題有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸，不讓用動(dòng)畫實(shí)現(xiàn)，，想了想，開工了。。好了，代碼大概是這樣 群里的朋友提問了個(gè)問題：有個(gè)進(jìn)度條，當(dāng)進(jìn)度條出現(xiàn)在視野中的時(shí)候，開始加載，消失的時(shí)候進(jìn)度條歸0，不讓用css3動(dòng)畫實(shí)現(xiàn)，so，想了想，開工了。。html: ...

    zzbo 評(píng)論0 收藏0

  • mui進(jìn)度條使用解析

    mui 進(jìn)度控件使用方法： 檢查當(dāng)前容器(container控件)自身是否包含.mui-progressbar類： 當(dāng)前容器包含.mui-progressbar類，則以當(dāng)前容器為目標(biāo)控件，直接顯示進(jìn)度； 否則，檢查當(dāng)前容器的直接孩子節(jié)點(diǎn)是否包含.mui-progressbar類，若存在，則以遍歷到的第一個(gè)含有.mui-progressbar類的孩子節(jié)點(diǎn)為目標(biāo)控件，顯示進(jìn)度； 若當(dāng)前容器的直接孩子...

    mist14 評(píng)論0 收藏0

發(fā)表評(píng)論

0條評(píng)論

閱讀需要支付1元查看
<