我在寫一個類似輪播的組件,一個容器中圖片放大到一個值后換一個圖片,繼續(xù)放大,重復這個過程用了requireJS<script?src="https://cdn.bootcss.com/require.js/2.3.4/require.js"?data-main="js/main"></script>
<div?id="cover">
????<div?id="imgBox">
????????<img?src="images/6979b974a51a5fa66c22db8fa9feff5c.jpg">
????</div>
</div>main.jsrequire(["./config"],?function(){
????require(["jquery"],?function($){
????????require(["./carousel"],?function(autoPlay){
????????????var?img?=?$("img");
????????????autoPlay(img);
????????})
????});
});carousel.jsdefine(function(){
????var?pathArr?=?[
????????"images/0fad76a6669a0bc9dcac0f2bbcfac612.jpg",
????????"images/6b44f9a15afb4b64a381595223cbd436.jpg",
????????"images/6979b974a51a5fa66c22db8fa9feff5c.jpg",
????????"images/e74b72fe6e3b58511faf41d89bc2ce38.jpg"
????];
????var?autoPlay?=?function(img){
????????var?imgOriginWidth?=?img.width();
????????var?imgFinalWidth?=?imgOriginWidth?+?100;
????????var?imgOriginHeight?=?img.height();
????????//?等比縮放
????????var?imgFinalHeight?=?(imgFinalWidth?*?imgOriginHeight)/imgOriginWidth;
????????var?i?=?4;
????????var?counter?=?0;
????????//?while(counter?<?i){
????????????if(img.width()?<?imgFinalWidth){
????????????????img.stop().animate({
????????????????????width:?"+=100px",
????????????????????height:?"+="?+?(imgFinalHeight?-?imgOriginHeight)?+?"px",
????????????????????left:?"-=50px",
????????????????????top:?"-=50px"
????????????????},?1000,?function(){
????????????????????currentIndex?=?pathArr.indexOf(img.attr("src"));
????????????????????img.attr("src",?pathArr[currentIndex?+?1]);
????????????????????img.css({
????????????????????????width:?imgOriginWidth?+?"px",
????????????????????????height:?imgOriginHeight?+?"px",
????????????????????????left:?"0px",
????????????????????????top:?"0px"
????????????????????});
????????????????????counter++;
????????????????????console.log("執(zhí)行");
????????????????});
????????????}
????????//}
????}
????return?autoPlay;
})我在回調(diào)函數(shù)中遞增了計數(shù)器啊,為什么還會卡死。
while()卡死了
慕先生4543078
2017-08-04 17:03:39