*{
box-sizing: border-box;
}
.gunDong{
background-color: #F4F4F4;
height:30px;
border-radius:5px;
color: #F85E6E;
font-size: 16px;
line-height: 30px;
box-sizing: border-box;
/* padding: 0px 5px; */
margin: 20px 0;
}
.gunDong ul{
height: 30px;
padding: 0 !important;
}
.gunDong li{
float: left;
list-style: none;
display: flex;
/* justify-content: flex-end; */
/* min-width: 100%; */
}
<div class="col-md-12 col-xs-12 col-sm-12 column">
<div class="pix-content gunDong gunDong1" style="overflow: hidden;">
<ul>
<?php foreach ($notice as $key => $value): ?>
<li><a style="color:#f85e6e;" href="#">{$value['content']}</a></li>
<?php endforeach ?>
</ul>
</div>
</div>
$(function(){
let itemWidth=$(".gunDong1").width();
$(".gunDong1 li").css({"min-width":itemWidth+"px"})
$(".gunDong1>ul").css({width:itemWidth*$(".gunDong1 li").length+"px",display:"flex"});
console.log(itemWidth)
let marginLeft=itemWidth;
$(".gunDong1 ul").css({"margin-left":marginLeft+"px"})
console.log(marginLeft)
setInterval(()=>{
$(".gunDong1>ul").animate({
"margin-left":(marginLeft-=itemWidth/800)+"px"
},2.5,function(){
// console.log(1);
if(marginLeft<=-$(".gunDong1 ul").width()){
marginLeft=itemWidth
$(".gunDong1 ul").animate({"margin-left":itemWidth+"px"},5)
}
})
},2.5)
})
jQ广告横向滚动
最新推荐文章于 2021-06-04 11:43:32 发布