微信小程序官方文档有说明，disable-scroll="true" 可以阻止页面下拉和滚动。这里有个坑，disable-scroll在真机上如果要生效，那么要给canvas绑定一个触摸事件才能生效。

必须绑定三个事件真机才能捕获到

<canvas disable-scroll="true" bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd" canvas-id="canvas" class="canvas"></canvas>

小程序开发：canvas在画布上滑动，页面跟着滑动问题的更多相关文章

  1. 微信小程序开发之多图片上传+服务端接收

    前言: 业务需求,这次需要做一个小程序同时选中三张图片一起上传到服务端,后端使用的.NET WEBAPI接收数据保存. 使用技术: 在这章中将会使用到微信小程序wx.uploadFile(Object ...

  2. 小程序开发-Canvas画布组件

    Canvas画布 基本使用方法: 在wxml中添加canvas组件 <canvas canvas-id='canvasDemo' class='demo'></canvas> ...

  3. 微信小程序开发3之保存数据及页面跳转

    第一  保存本地数据 1.异步保存本地数据 wx.setStorage({ key:keyStr, data:dataStr, success: function(e){}, fail: functi ...

  4. 微信小程序开发-概述

    微信小程序开发-概述 一.小程序申请&APPID 登录微信平台申请成为小程序开发者,小程序不可直接使用服务号或订阅号的AppID,需要登录微信公众平台管理后台,在网站的"设置&quo ...

  5. 微信小程序 在canvas画布上划动，页面禁止滑动

    要实现微信小程序 在canvas画布上划动,页面禁止滑动,不仅要设置disable-scroll="true",还要要给canvas绑定一个触摸事件才能生效. <canvas ...

  6. 微信小程序开发日记——高仿知乎日报（上）

    本人对知乎日报是情有独钟,看我的博客和github就知道了,写了几个不同技术类型的知乎日报APP 要做微信小程序首先要对html,css,js有一定的基础,还有对微信小程序的API也要非常熟悉 我将该 ...

  7. 微信小程序开发--宽为百分百，页面仍可左右滑动

    这段时间小程序开发时,很多时候,希望内容充满整个屏幕(高度.宽度100%),如下图 但是在设置 .followrecords-container{width:100%;} 后发现 手机在横向上虽然页面 ...

  8. [转]微信小程序开发（二）图片上传+服务端接收

    本文转自:http://blog.csdn.net/sk719887916/article/details/54312573 文/YXJ 地址:http://blog.csdn.net/sk71988 ...

  9. 微信小程序开发技巧总结（二） -- 文件的选取、移动、上传和下载

    微信小程序开发技巧总结(二) -- 文件的选取.移动.上传和下载 1.不同类型文件的选取 1.1 常用的图片 视频 对于大部分开发者来说,需要上传的文件形式主要为图片,微信为此提供了接口. wx.ch ...

  10. 微信小游戏开发Canvas资源汇总

    Demo: 微信小程序demo组件:股票分时图 微信小程序小组件:仿直播点赞气泡效果,基于Canvas 优质demo推荐:二维码生成器:使用canvas与纯JS版二维码生成 微信小程序学习用完整dem ...

随机推荐

  1. 活代码LINQ——06

    一.模块代码 ' Fig. 9.4: LINQWithArrayOfObjects.vb ' LINQ to Objects using an array of Employee objects. M ...

  2. Python列表的增删改查和元祖

    一.定义列表 1.names = ['mike','mark','candice','laular'] #定义列表 2.num_list = list(range(1,10)) #range生成1-1 ...

  3. nodejs03-GET数据处理

    数据请求:--- 前台:form ajax jsonp 后台:一样 请求方式: 1.GET 数据在URL中 2.POST 数据在请求体中 请求数据组成: 头--header:url,头信息 身子--c ...

  4. 原生js实现淘宝图片切换

    这个淘宝图片切换具体效果就是:鼠标移上底部一行中的小图片,上面大图片区域就会显示对应的图片. gif图片看起来还挺酷的,其实实现很简单,用原生js绑定事件改变大图片区域的src. 上代码,html部分 ...

  5. Problem C: 平面上的点和线——Point类、Line类 (III)

    Description 在数学上,平面直角坐标系上的点用X轴和Y轴上的两个坐标值唯一确定,两点确定一条线段.现在我们封装一个“Point类”和“Line类”来实现平面上的点的操作. 根据“append ...

  6. c# word interop encrypt with password protect with password

    public static void EncryptWithPassword(string unEncryptedWordPath, string password) { Word.Applicati ...

  7. python基础（字符串常用方法）

    字符串不常用方法: 字符串常用的方法: #看源代码 按住ctrl点击方法名 用户注册的小程序 import datetimeusers = []passwds = []for i in range(3 ...

  8. 实现自适应位置--footer紧贴浏览器底部

    <!DOCTYPE HTML><html><head><meta charset="utf-8"><title>紧贴浏览 ...

  9. tensorFlow入门实践（三）实现lenet5（代码结构优化）

    这两周我学习了北京大学曹建老师的TensorFlow笔记课程,认为老师讲的很不错的,很适合于想要在短期内上手完成一个相关项目的同学,课程在b站和MOOC平台都可以找到. 在卷积神经网络一节,课程以le ...

  10. Linux系统中安装Oracle数据库

    安装前的准备 三个包:winx64_12201_database.zip(oracle数据库) window_7(安装在虚拟机中的window7纯净版系统) client.zip(oracle的监听器 ...