做一个微信项目,使用MUI做框架,在使用scroll定位的时候,出现了定位不准确的问题,查询了好多资料,得知他是相对定位。折腾了好久,才搞定,现在做一个笔记。

 mui('body').on('tap', 'a', function (e) {
var data = this.getAttribute('val');
mui('.mui-scroll-wrapper').scroll().reLayout();//重新计算布局值,最大滚动的高度等等
let y = 0;
let current_top = mui('.mui-scroll-wrapper').scroll().y;
switch (data) {
case 'p'://商品
mui('.mui-scroll-wrapper').scroll().scrollTo(0, y, 100);
break;
case 'i'://简介
y = $('#dvpintro').offset().top-120; //计算位置
y = parseInt(current_top - y);
if (y > 0)
y = -y;
mui('#scroll1').scroll().scrollTo(0, y , 100);
break;
case 't': //套餐
y = $('#dvpintro').offset().top + (- 1700);//计算位置
y = current_top - y;
if (y > 0)
y = -y;
mui('.mui-scroll-wrapper').scroll().scrollTo(0, y, 100);
break;
}
});

 出事位置

参考文章:http://blog.csdn.net/sbt0198/article/details/51755843

http://www.cnblogs.com/CyLee/p/5324622.html

 

MUI scroll 定位问题的更多相关文章

  1. mui scroll和上拉加载/下拉刷新

    mui中 scroll和上拉加载/下拉刷新同时存在会出现两个滚动条 把/*   */ /* //mui页面鼠标拖动代码: mui('.mui-scroll-wrapper').scroll({ dec ...

  2. MUI - Scroll插件的使用

    http://dev.dcloud.net.cn/mui/ui/#scroll 神坑1:如果在vuejs中使用,那么需要配合mui.ready(function(){}) 才能找到dom对象,具体de ...

  3. MUI 实用教程

    MUI 实用JS教程: https://www.kancloud.cn/benhailong/mui/319751  MUI 实用教程: https://www.kancloud.cn/benhail ...

  4. MUI开发APP,scroll组件,运用到区域滚动

    最近在开发APP的过程中,遇到一个问题,就是内容有一个固定的头部和底部.         头部就是我们常用的header了,底部的话,就放置一个button,用来提交页面数据或者进入下一个页面等,效果 ...

  5. mui 怎样监听scroll事件的滚动距离

    var scroll = mui('.mui-scroll-wrapper').scroll(); document.querySelector('.mui-scroll-wrapper' ).add ...

  6. mui 下拉刷新

    mui 下拉刷新 此文提供的是mui这种下拉刷新.悬浮于页面上,比较好用. <!DOCTYPE html> <html> <head> <meta chars ...

  7. MUI - 侧滑菜单

    各大APP必备的侧滑菜单栏,支持手势滑动.包含QQ式.美团式等 结构模板 这里是示例Html, 必须使用Mui框架才能使用. 主容器 <div class="mui-off-canva ...

  8. MUI - DIV窗体切换

    神坑记录: 1.js报错异常:没有找到"innerHeight"属性? 解决方案:暂时不知原因,通过对mui.view.js进行调试得知是跳转目标页没有 .mui-navbar-l ...

  9. MUI - 上拉刷新/下拉加载

    新闻信息列表必备的功能,支持Table,Ul等列表. 以下是DIV版本,在安卓端或者ios端必须使用双webview模式,传送门:http://dev.dcloud.net.cn/mui/pulldo ...

随机推荐

  1. 于是他错误的点名开始了(trie树)

    题目背景 XS中学化学竞赛组教练是一个酷爱炉石的人. 他会一边搓炉石一边点名以至于有一天他连续点到了某个同学两次,然后正好被路过的校长发现了然后就是一顿欧拉欧拉欧拉(详情请见已结束比赛CON900). ...

  2. poj_2773_Happy 2006

    Two positive integers are said to be relatively prime to each other if the Great Common Divisor (GCD ...

  3. samba文件共享服务的配置

    samba文件共享服务的配置 服务端配置 一.安装samba软件包 命令:yum -y install samba 查看是否安装samba. [root@Centos7-Server haha]# [ ...

  4. frame3.5安装出错

    一般是因为禁用了microsoft update,可以在服务里禁用改为手动,之后启动,然后就可以安装

  5. 【acl-访问控制列表】

    配置acl访问控制列表{ firewall enable:开启路由器防火墙功能 fire default {permit || deny}:设置防火墙的默认行为: acl number[2000,29 ...

  6. JavaScript鼠标事件

    mousedown 鼠标被按下. mouseup 鼠标按钮被释放(抬起). click 鼠标左键(或中建)被单击. 事件触发顺序:mousedown>mouseup>click>db ...

  7. PHP队列之理论篇

    定义: 特殊的线性表.       特点: 1.先进先出:连结性. 2.作为一种特殊性的表,主要是在表前端进行删除操作,我们称删除的端为对头(front):只能在表的后端进行插入操作,我们称之为称插入 ...

  8. Linux基础(04)、功能配置(调整防火墙、静态IP、环境变量)

    目录 一.centos防火墙 二.VMware网络连接方式 2.1.连接方式:桥接.NAT.仅主机 2.2.常见问题 三.centos配置静态IP 四.环境变量 4.1.什么是环境变量 4.2.临时修 ...

  9. 数据分析处理库Pandas——索引进阶

    Series结构 筛选数据 指定值 备注:查找出指定数值的索引和数值. 逻辑运算 备注:查找出值大于2的数据. 复合索引 DataFrame结构 显示指定列 筛选显示 备注:值小于0的显示原值,否则显 ...

  10. QOS-基本拥塞管理机制(PQ CQ WFQ RTPQ)

    QOS-基本拥塞管理机制(PQ CQ WFQ RTPQ) 2018年7月7日    20:29 拥塞:是指当前供给资源相对于正常转发处理需要资源的不足,从而导致服务质量下降的一种现象 拥塞管理概述: ...