canvas画布，在手机端写字应用屏幕会跟着滚动

问题概述：

前几天要写一个手机端的签名插件，网上找来找去都是jquery的signature插件，原理是canvas画布，监听touch事件，pc端好好的，但放在移动端，当手指触屏的时候，页面会跟着滚动，实在是难受至极。

<canvas id="canvas" style="width: 100%;height: 100%"></canvas>

解决办法：

如果页面的一屏的话，即没有滚动条，可以给页面外面包一层div，并将div设置成position: fixed

自此，解决完毕，页面就不滚动了

<div style="display:fixed;width:100%;left:0;top:0;">

<canvas id="canvas" style="width: 100%;height: 100%"></canvas>

</div>

由于我的内容页只有一屏，所以完美的解决了

但如果页面不是一屏的话，目前我想到的方法是在需要canvas画布的地方，做弹层，就是将canvas的部分：position:fixed

这样暂时解决。 问题，其实后面的页面还是会跟着滚动的，虽然不影响canvas的画图

所以这不是很完美的办法，我暂时还没想到更好的，如果路过大神经历过这个问题，恳请留言指点一二，谢谢

 

转载于:https://www.cnblogs.com/lcy0111/p/10277348.html