<div class="zs_li_div">
<zh:info cid="26">
<li class="li">
<img src="{z$vo.thumb}" alt="">
</li>
</zh:info>
</div>
(我这里是项目中标签的调用,写的时候直接写li就行了,后面会将li插入ul)
<script>
var $li3n = $(".li:nth-child(3n)").each(function (i) { $(".li").slice(i * 3, i * 3 + 3).wrapAll("<ul class='pro_ul'></ul>"); });
//剩下的再用ul包起来
$(".li").slice($li3n.length * 3).wrapAll("<ul class='pro_ul'></ul>");
上面的内容才是关键 ↑
以下是项目中不满3个需要不同的展示效果,这里可以忽视!↓
var len = $(".section_con>.pro_ul").length
for (var i = 0; i < len; i++) {
var l = $(".section_con>.pro_ul").eq(i).find(".li").length
if (l == 1) {
$(".section_con>.pro_ul").eq(i).find(".li").css("width", "100%")
}
if (l == 2) {
$(".section_con>.pro_ul").eq(i).find(".li").css("width", "50%")
}
if (l == 3) {
$(".section_con>.pro_ul").eq(i).find(".li").css("width", "33.33%")
}
}
</script>