案例还原

小程序做一个进度条,可以通过拽转控制进度

那么肯定有一个进度条,不过小程序自己会做适配宽高

6s下这个div的width 是250

6splus就是276

但是问题来了,我拖拽用的是translateX,

这个值,小程序不会帮忙增加,

举个例子在6s机子下,进度条分为三级

总宽度250分为三段,那么translateX:低级为0,中级为225,高级就是250(不考虑拖拽图片的宽度)

这个值是写死的

在6sPlus的情况下,这个进度条宽度就自动增加为276,但是,我的translateX的值并不会自动增加,就会出现这样的情况

这就对不上了,那怎么解决

调用小程序api,获取dom元素增加后的width,手动给赋值

回调结果会显示当前dom的属性

然后,想怎么玩就怎么玩了

小程序踩坑之不同屏幕下动态改变translate值的更多相关文章

  1. 微信小程序踩坑集合

    1:官方工具:https://mp.weixin.qq.com/debug/w ... tml?t=1476434678461 2:简易教程:https://mp.weixin.qq.com/debu ...

  2. 微信小程序踩坑之一[thist]使用技巧

    刚上手小程序 时,习惯把this当成jquery中的$(this)来用,实际上这两个还是有差别的 在页面方法中调用其他方法,一般是用this.function(),直接调用小程序 的方法或函数则是用w ...

  3. 小程序踩坑记录-上传图片及canvas裁剪图片后上传至服务器

    最近在写微信小程序的上传图片功能,趟过了一些坑记录一下. 想要满足的需求是,从手机端上传图片至服务器,为了避免图片过大影响传输效率,需要把图片裁剪至适当大小后再传输 主要思路是,通过wx.choose ...

  4. 微信小程序踩坑之一【weui-wxss-master单选按钮图标修改思路】

    小程序原生所带的weui框架做小程序UI实在太方便了,但是他的一些细微变化也是让开发中碰到不少头疼的问题 一直以来单选多选的美化都是设计师重点表达的地方之一 而weui-wxss-master中的单选 ...

  5. 微信小程序踩坑之一[wx.request]请求模式

    最近在做小程序时,使用wx.request()方法请求时, 当使传输string类型时,一定要声明method请求模式为post,否则会一直报错,而不声明时默认为get, 已填坑 =,= wx.req ...

  6. 微信小程序踩坑记

    1:微信小程序之去掉横向滑动滚动条 /** 去除横向滚动条 */ ::-webkit-scrollbar { width: 0; height: 0; color: transparent; } 2: ...

  7. 微信小程序踩坑日记1——调用微信授权窗口

    0. 引言 微信小程序为了优化用户体验,取消了在进入小程序时立马出现授权窗口.需要用户主动点击按钮,触发授权窗口. 那么,在我实践过程中,出现了以下问题. . 无法弹出授权窗口 . 希望在用户已经授权 ...

  8. 小程序 ----踩坑 ---安卓iOS兼容等

    关于小程序一些小功能的代码都在这个GitHub上,感兴趣的可以去看看,https://github.com/huihuijiang/miniProgram目前有:列表左滑删除,拖拽浮标 一.小程序坑1 ...

  9. 微信小程序踩坑之前端问题处理篇

    近期完成了一个小程序,自己做的前后端开发.真是惨哭我了o(╥﹏╥)o,下面几点希望大家可以避雷. 首先,想先介绍一下我遇到问题的解决思路: 1.先在postman调试接口,看数据获取是否正常, 2.在 ...

随机推荐

  1. 解决WCF部署到IIS出现“证书必须具有能够进行密钥交换的私钥,该进程必须具有访问私钥的权限”

    访问WCF服务时,出现异常详细信息: System.Security.Cryptography.CryptographicException: 密钥集不存在.ArgumentException: 证书 ...

  2. python笔记7:优雅的python

    7. 如何让python代码更 Pythonic : 1.变量交换: a, b = b, a 2.带有索引位置的集合遍历: colors = ['red', 'green', 'blue', 'yel ...

  3. python对象的复制问题

    list 的拷贝问题: 1, >>> a [1, 2] >>> b=a[:] >>> b [1, 2] >>> b[0]=20 ...

  4. Longest Valid Parentheses - LeetCode

    Given a string containing just the characters '(' and ')', find the length of the longest valid (wel ...

  5. JUC线程池深入刨析

    JDK默认提供了四种线程池:SingleThreadExecutor.FiexdThreadPool.CachedThreadPool.ScheduledThreadPoolExecutor. 本文会 ...

  6. 各语言最原始数据库访问组件封装DBHelper

    源码:https://github.com/easonjim/DBHelper bug提交:https://github.com/easonjim/DBHelper/issues 每个语言放在不同的分 ...

  7. WebStorm添加多个项目到当前工程目录

    File-> Settings -> Directories -> Add Content Root,选择你要加入的Project 点击OK -> Apply -> OK ...

  8. (译)关于使用Eclipse Memory Analyzer的10点小技巧

    作者 Rave_Tian 2016.02.01 17:56* 字数 2988 阅读 520评论 0喜欢 0 分析和理解应用的内存使用情况是开发过程中一项不小的挑战.一个微小的逻辑错误可能会导致监听器没 ...

  9. json字符串调整

    碰到比较长的json字符串,不知道哪里出错时,可以找一个正确的json字符串,慢慢把它调整到需要的形式,而不是去分析,字符串太长,一直看,效率太慢,容易看花眼.

  10. MFC中 报错:error : bitmap file Res\tankBattle.ico is not in 3.00 format

    今天换了一个ico图标,本来源图像是bmp的,让我改了后缀名成ico. 然后编译就报错了:error : bitmap file Res\tankBattle.ico is not in 3.00 f ...