图片轮播
<div class="layui-col-md3" style="height: 300px;background: white;padding-top: 8px"> <div class="img_select"> <div class="layui-carousel" id="imgScroll"> <div carousel-item id="shopPics"> </div> </div> </div> </div>
.img_select { height: 274px; padding: 10px; /*box-shadow: 0 0 10px 5px #e3e3e3;*/ } .img_select img { width: 100%; height: 100%; }
$.myAjax({ url: '/baseData/shopManage/getCommonShopDetail.do', type: "POST", dataType: "json", data: { rowKey: shopType + "#" + shopId }, success: function (result) { var html = ""; if (result) { var dataArray = []; if (result.busLicURL && result.busLicURL != "-1") { dataArray.push(result.busLicURL); } if (result.fodLicURL && result.fodLicURL != "-1") { dataArray.push(result.fodLicURL); } for (var i = 0; i < dataArray.length; i++) { html += '<div class="openDetail" style="cursor: pointer;"> <img src="' + dataArray[i] + '"></div>' } if (html == "") { html += '<div><img src="/resource/images/noimage2.jpg"></div>' } } else { html += '<div><img src="/resource/images/noimage2.jpg"></div>' } $("#shopPics").append(html); //layui图片轮播 layui.use('carousel', function () { var carousel = layui.carousel; //建造实例 carousel.render({ elem: '#imgScroll' , width: '100%' //设置容器宽度 , height: '100%' , arrow: 'hover' //始终显示箭头 , autoplay: true , interval: 5000//轮播切换时间 //,anim: 'updown' //切换动画方式 }); }); // 轮播图片点击事件 $('.openDetail').click(function () { window.open($(this).children().prop('src')) }) } })
故乡明