資訊專欄INFORMATION COLUMN
摘要：群里的朋友提問了個問題有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸，不讓用動畫實現，，想了想，開工了。。好了，代碼大概是這樣
群里的朋友提問了個問題：
有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸0，不讓用css3動畫實現，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");
}
});
好了，代碼大概是這樣~
文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。
轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/80254.html
摘要：群里的朋友提問了個問題有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸，不讓用動畫實現，，想了想，開工了。。好了，代碼大概是這樣 群里的朋友提問了個問題：有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸0，不讓用css3動畫實現，so，想了想，開工了。。html: ...
摘要：群里的朋友提問了個問題有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸，不讓用動畫實現，，想了想，開工了。。好了，代碼大概是這樣 群里的朋友提問了個問題：有個進度條，當進度條出現在視野中的時候，開始加載，消失的時候進度條歸0，不讓用css3動畫實現，so，想了想，開工了。。html: ...
mui 進度控件使用方法： 檢查當前容器(container控件)自身是否包含.mui-progressbar類： 當前容器包含.mui-progressbar類，則以當前容器為目標控件，直接顯示進度； 否則，檢查當前容器的直接孩子節點是否包含.mui-progressbar類，若存在，則以遍歷到的第一個含有.mui-progressbar類的孩子節點為目標控件，顯示進度； 若當前容器的直接孩子...
閱讀 1883·2021-11-22 09:34
閱讀 3009·2021-09-28 09:35
閱讀 13374·2021-09-09 11:34
閱讀 3594·2019-08-29 16:25
閱讀 2820·2019-08-29 15:23
閱讀 2035·2019-08-28 17:55
閱讀 2424·2019-08-26 17:04
閱讀 3044·2019-08-26 12:21
