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的画图

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

 


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM