• 点击图片等比缩放


            //图片切换展示
            function changeInfo(tag) {
                var tmp = $(tag).width();
                console.log(tmp);
                if (tmp > 90) {
                    ImgZoom(tag, 90);
                } else {
                    $(tag).css("width", "").css("height", "");//删除指定宽度 采用原始宽度
                    ImgZoom(tag, 1000);
                }
            }
    
    
            //图片等比缩放
            function ImgZoom(tag, w) {
    
                var img_w = $(tag).width();//图片宽度
                var img_h = $(tag).height();//图片高度
    
                if (img_w > w) {//如果图片宽度超出指定最大宽度
                    var height = (w * img_h) / img_w; //高度等比缩放
                    $(tag).css({
                        "width": w, "height": height
                    });//设置缩放后的宽度和高度
                }
    
            }
    
    
            //加载时全部图片等比缩放
            function AllImgZoom() {
    
                var w = 90;//设置最大宽度,也可根据img的外部容器 而动态获得,比如:$("#demo").width();
                $("img").each(function () {//如果有很多图片,使用each()遍历
                    var img_w = $(this).width();//图片宽度
                    var img_h = $(this).height();//图片高度
    
                    var height = (w * img_h) / img_w; //高度等比缩放
    
                    $(this).css({
                        "width": w, "height": height
                    });
    
                });
            }
    <img onclick="changeInfo(this)" src=" http://116.6.55.44:10006/Attachment/Case/50e21e0a-bf2c-4370-8d3a-4e40ca8316e1.jpg" style=" 90px;">
  • 相关阅读:
    vue chrome调试工具开启
    mac显示隐藏文件
    mac网络变慢?
    57-文件处理小结
    56-文件修改的两种方式
    54-with管理文件操作上下文
    53-文件的三种打开方式
    51-基本文件操作
    50-Python2和3字符编码的区别
    49-字符编码
  • 原文地址:https://www.cnblogs.com/zyx321/p/9145502.html
Copyright © 2020-2023  润新知