昨天在手机上的一个轮播图,对于本地的图片,通过JS可以直接设置图片的全屏宽度,但是到了服务器加载之后的图片,却不能如愿的设置。最后找其原因,才发现应该在ajax加载成功之后 模板渲染完成之后 图片img.load加载完成之后 再进行图片的宽度设置 就可以了
//获取轮播的数据
function getTopData(param,cb){
$.ajax({
url: 'http://120.25.106.244:9001/api/Activity/GetAll',
data:param,
cache:false,
success:function(res){
$(".imgbox ul").html(template("imgBox1",{data:res}));
var imgCount=0;
var len=$('.imgbox ul img').length;
$('.imgbox ul img').each(function(){
$(this).css({width:$(window).width()});
this.οnlοad=function(){
imgCount++;
if(imgCount==len){
$.mggScrollImg('.imgbox ul',{
loop : true,//循环切换
auto : true,//自动切换
auto_wait_time:3000,//轮播间隔
scroll_time:300,//滚动时长
callback : function(ind){//这里传过来的是索引值
$(".box li").removeClass('active');
$(".box li:eq("+ind+")").addClass("active");
}
});
}
}
})
}
})
}