【JQ】点击图片放大缩小（添加样式实现）

基于layui的图片放大

在弹窗中显示放大图片

    $('body').on('click', '.imgSM', function () {
        var imgsrc = $(this).attr('src');
        var index = layer.open({
            type: 1,
            title: '查看大图',
            closeBtn: 2,
            shadeClose: true,
            offset: '10px',
            area: ['80%', '90%'],
            shade: 0.6,
            id: 'lookAtTheBigPicture', //设定一个id，防止重复弹出
            btnAlign: 'c',
            moveType: 1, //拖拽模式，0或者1
            content: '<div style="width: 90%;height: 100%;display: flex;align-items: center;justify-content: center;margin: 0px auto;"><img src="' + imgsrc + '" style="width: 100%"></div>',
            success: function (layero) {}
        })
    })

给图片添加相应的imgSM样式属性即可

  $('#' + item.img).show().attr('src', '/doFile/download?attachmentId=' + fileId).addClass('imgSM');