版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/messicr7/article/details/85005156
.group .items{
width: 95%;
height: 180px;
overflow: hidden;
margin:25px auto;
}
.group .items ul{
width: 99999px;
overflow: hidden;
}
.group .items ul>li{
width: 170px;
text-align: center;
padding: 20px 10px 5px 15px;
display: inline-block;
float: left;
}
.group .items ul > li > a{
display: block;
height: 70px;
}
.group .items ul > li > a > img{
height: auto;
height: 28px;
width: auto;
max-width: 100%;
display: block;
margin: auto;
}
<script type="text/javascript">
$(document).ready(function() {
$("#mainNav .navList .index").addClass("active");
itemMarguee();
});
// 滑动
function itemMarguee(){
$("#items ul").animate({marginLeft:"-190px"},8000, function () {
$("#items ul>li").eq(0).appendTo($("#items ul"));
$("#items ul").css('marginLeft','0px');
})
setTimeout(itemMarguee(),8000);
};
</script>
<div class="group">
<div class="items" id="items">
<ul>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_0.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_1.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_2.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_3.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_4.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_5.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_6.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_7.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_8.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_9.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_10.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_11.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_12.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_13.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_14.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_15.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_16.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_17.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_18.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_19.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_20.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_21.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_22.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_23.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_24.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_25.png')}">
</a>
</li>
<li>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_26.png')}">
</a>
<a href="JavaScript:void(0)" target="_blank">
<img src="${fn:getResource('static/hdds/skins/images/group/logo_27.png')}">
</a>
</li>
</ul>
</div>
</div>