layui点击放大图片/旋转
//原图片
<img src="@(Model.Img)" style="width: 100px; height: 100px;" onclick="amplificationImg('@(Model.Img)')" />
//放大的图片
<img alt="" style="display:none;width:500px;height:500px;" id="displayImg" src="" />
<script> function amplificationImg(url) { $("#displayImg").attr("src", url); layer.open({ type: 1, title: false, closeBtn: 1, shadeClose: true, area: ['630px','600px'], //宽高 content: "<img src=" + url + " style='width: 500px; height: 500px;' />" }); } </script>
2.放大/旋转
<div id="layer-photos-demo" class="layer-photos-demo"><img layer-pid="图片id,可以不写" layer-src="/9e8.png" width="100" height="100" src="/8.png" alt="图片名"> </div> layer.photos({ photos: '#layer-photos' , anim:3, //0-6的选择,指定弹出图片动画类型,默认随机(请注意,3.0之前的版本用shift参数) closeBtn: 1, tab: function () { num = 0; $("#layui-layer-photos").append('<div class="icon" style="position:relative;width:100%;text-align:center;top:-133px;cursor:pointer;">\n' + '\t\t<img src="xz.png" style="width:30px;height30px;">\n' + '\t</div>'); } }); $(document).on("click", ".icon img", function (e) { num = (num + 90) % 360; $(".layui-layer.layui-layer-page.layui-layer-photos").css('transform', 'rotate(' + num + 'deg)'); //$(".layui-layer-phimg img").css('transform','rotate('+num+'deg)');此处只能旋转图片 });
莫谈他人高薪,且看闲时谁在拼.