小程序image图片mode=“widthFix“图片显示瞬间竖向拉伸变形闪烁解决办法

news/2024/7/20 1:39:12 标签: 小程序, css, 微信小程序

在这里插入图片描述

在微信小程序给图片设置了宽度,然后设置了mode=“widthfix”,但是发现有的手机上会出现第一次进入页面加载图片的瞬间,图片会被拉的很长,然后恢复正常。然后把图片的高度也设置rpx的话,就不会出现这种情况了,所以小程序里图片需要设置高度。
在这里插入图片描述
官方文档中 mode=“widthFix” 宽度不变,高度自动变化,保持原图宽高比不变,即设置图片宽度而高度自适应。

但是在实际开发中发现图片在初始加载时瞬间竖向拉伸变形闪烁然后恢复正常宽高,也许是高度没设置的原因。

所以需要在app.wxss全局中把图片设置

image{
  width: 100%;
  height: auto;
}

即可解决问题


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

相关文章

html 下拉菜单select 获取数据库内容

用ajax去后台数据库中访问数据&#xff0c;操作select <select id"mySelect"> <option>请选择</option> </select> 前台js&#xff1a; <script> $(document).ready(function () {var url"/compare/test"; //访问后台去数据…

【集合源码系列】TreeSet源码解析

集合源码解析 ArrayList LinkedList HashMap&#xff08;一&#xff09; 、 HashMap&#xff08;二&#xff09; 、 HashMap&#xff08;三&#xff09; LinkedHashMap TreeMap&#xff08;一&#xff09; 、 TreeMap&#xff08;二&#xff09; 、 TreeMap&#xff08;…

苹果App侵权纠纷,我该怎么办?

工程师小A是一个互联网公司普普通通的iOS软件开发工程师&#xff0c;有一天他想了一个不错的idea&#xff0c;感觉很兴奋&#xff0c;于是想试试自己捣鼓一个开发者账号做上一做&#xff0c;他给App起了个不错的名字&#xff0c;每天下班埋头研发&#xff0c;最终发布了产品&am…

小程序获取附近IBeacon设备

实现逻辑&#xff1a; 该功能实现需要使用以下API&#xff1a; wx.startBeaconDiscovery(OBJECT)&#xff1a;开始搜索附近的iBeacon设备 wx.stopBeaconDiscovery(OBJECT)&#xff1a;停止搜索附近的iBeacon设备 wx.onBeaconUpdate(CALLBACK)&#xff1a;监听 iBeacon 设备…

EL表达式嵌套${${}}

user:是一个对象&#xff0c;user{"name"&#xff1a;"zj", sex:"f", grade:"99"} list 是个集合&#xff0c;存入了一个或多个user对象 set:集合&#xff0c;存入的是user的key [name&#xff0c;sex, grade] 我想用${list[0].nam…

uni-app项目使用uCharts高性能跨全端图表组件

前言&#xff1a; uCharts全新图表组件&#xff0c;全端全平台支持&#xff0c;开箱即用&#xff0c;可选择uCharts引擎全端渲染&#xff0c;也可指定PC端或APP端单独使用ECharts引擎渲染图表。支持极简单的调用方式&#xff0c;只需指定图表类型及传入符合标准的图表数据即可…

隐藏的密文 (转)

隐藏的密文 (转)[more]隐藏的密文听说有一种软件&#xff0c;可以将一定的密文隐藏在图形文件中&#xff0c;我没有用过&#xff0c;不过这个想法很好&#xff0c;嗯……我的意思是正好作为我的练习。 于是我打开winhex&#xff0c;试了各种不同后缀的图形文件&#xff0c;发现…

ramfs和tmpfs的区别

简介 ramfs和tmpfs是在内存上建立的文件系统&#xff08;Filesystem&#xff09;。其优点是读写速度很快&#xff0c;但存在掉电丢失的风险。如果一个进程的性能瓶颈是硬盘的读写&#xff0c;那么可以考虑在ramfs或tmpfs上进行大文件的读写操作。 ramfs和tmpfs之间的区别&#…