【微信小程序】根据屏幕尺寸去调整图片尺寸宽高比

news/2024/7/19 15:08:20 标签: 1024程序员节, 小程序, js, 图片, 图片自适应

1.获取图片的原始宽高,并获取到图片原始宽高的宽高比

let src = "图片地址"
wx.getImageInfo({
    src,
    success: function(res){
        let originalWidth = res.width;
        let originalHeight = res.height;
        let originalScale = parseInt(originalHeight/originalWidth);//图片高宽比   
    }
})

2.获取屏幕的宽高,并获取到屏幕宽高的宽高比


        wx.getSystemInfo({
            success: function (res) {
              let windowWidth = res.windowWidth - 36 ;
              let windowHeight = res.windowHeight;
              let windowscale = parseInt(windowHeight/windowWidth);//屏幕高宽比
            }
        })

3.计算图片尺寸

if(originalScale < windowscale){//图片高宽比小于屏幕高宽比
    //图片缩放后的宽为屏幕宽
    imageSize.imageWidth = parseInt(windowWidth);
    imageSize.imageHeight = parseInt((windowWidth * originalHeight) / o

http://www.niftyadmin.cn/n/1498975.html

相关文章

20155227 《Java程序设计》实验五 Java网络编程及安全实验报告

20155227 《Java程序设计》实验五 Java网络编程及安全实验报告 实验内容 任务一&#xff1a; 编写MyBC.java实现中缀表达式转后缀表达式的功能。编写MyDC.java实现从上面功能中获取的表达式中实现后缀表达式求值的功能。 我们如何编程实现bc? 把中缀式转化后缀式调用MyDC.java…

idea tomcat项目部署失败_在IDEA下使用tomcat发布web项目遇到的小问题

1&#xff0c;打开以前的代码&#xff0c;发布后只能看到404状态原因是&#xff1a;①没有项目输出目录②发布包指定错误&#xff0c;正确方式如下&#xff0c;web项目以war包发布&#xff0c;点击“”号后选择artifact才可以------------------------------------------------…

Python控制台输出颜色

1 格式&#xff1a;\033[显示方式;前景色;背景色m说明&#xff1a;前景色 背景色 颜色 --------------------------------------- 30 40 黑色31 41 红色32 42 绿色…

app能不能跳转外部h5_H5手机站和APP,小说创业者应该选择哪个?

随着中国经济的发展&#xff0c;小部分人成为了富人&#xff0c;而绝大多数人都是不满足于现状的&#xff0c;每个人心中都有欲望&#xff0c;而小说则成为了人们宣泄欲望的入口。小说发展的源动力则是男女性内心的欲望需求&#xff0c;而这种现实需求也许会不断的发展或者改变…

shell编程—— EOF

在shell编程中&#xff0c;”EOF“通常与”<<“结合使用&#xff0c; “<<EOF“表示后续的输入作为子命令或子shell的输入&#xff0c;直到遇到”EOF“&#xff0c;再次返回到主调shell&#xff0c; 可将其理解为分界符&#xff08;delimiter&#xff09;。既然是分…

【H5】Cookie、Session、Token、JWT区别及使用方法

Token 和 Session 的区别 Session 是一种记录服务器和客户端会话状态的机制&#xff0c;使服务端有状态化&#xff0c;可以记录会话信息。而 Token 是令牌&#xff0c;访问资源接口&#xff08;API&#xff09;时所需要的资源凭证。Token 使服务端无状态化&#xff0c;不会存储…

程序员的最大噩梦是什么?

有国外程序员在 Quora 上提了一个问题&#xff1a;“程序员的最大噩梦是什么&#xff1f;”。本文摘编了这个问答贴的多个热门回复。 Brain Schmitz Software Engineer Intern at Google (2012, 2013), Microsoft (2014), CS major at UT Austin in Turing Scholars honors pro…

-bash: mysql: 未找到命令_docker搭建MySQL主从集群

关于MySQL主从模式&#xff0c;如果我们直接在本机上搭建的话&#xff0c;是没法搭建的&#xff0c;只能借助于虚拟机&#xff0c;但有的时候我们又需要搭建一个主从集群&#xff0c;以便于进行一些功能性的测试。这个时候我们就可以尝试使用docker&#xff0c;借助于docker的容…