一对一直播系统源码,软件首页轮播图轮播效果

一对一直播系统源码,软件首页轮播图轮播效果实现的相关代码

css部分

 

.banner{
width: 100%;
height: 200px;
overflow: hidden;
position: relative;
}
.nav{
width: 300%;
height: 200px;
position: absolute;
top: 0;
left: 0;
}
.nav .nav_box{
width: 33.33%;
height: 200px;
float: left;
}
.nav .nav_box img{
width: 100%;
height: 100%;
}

​div部分

 

<div class="banner">
<div class="nav">
<div class="nav_box">
<img src="imgs/banner.jpg" >
</div>
<div class="nav_box">
<img src="imgs/banner2.jpg" >
</div>
<div class="nav_box">
<img src="imgs/banner3.jpg" >
</div>
</div>
</div>

jquery部分

 

var num=1,clear,p=0;
function moves(){
  // $("nav").eq(p=(num-1)).addClass("lunbo").siblings().removeClass("lunbo")
num++;
if(num==3){
num=1;
};
$(".nav").animate({left:"-100%"},3000,function(){
$(".nav_box").eq(0).appendTo(".nav");
$(".nav").css("left","0px");
});
}

 

clear=setInterval(moves,3000);

以上就是一对一直播系统源码,软件首页轮播图轮播效果实现的相关代码, 更多内容欢迎关注之后的文章

 

posted @ 2021-11-11 14:09  云豹科技-苏凌霄  阅读(86)  评论(0编辑  收藏  举报