首先要說明的是這里不是用鼠標畫畫,而是在觸摸設備上用手指,比如ipad。
做畫圖板,自然使用html5的canvas來實現了。在canvas中我們可以畫圓,畫矩形,畫自定義的線條等等。這次主要使用的畫圓跟畫線條來實現。html中支持對觸摸事件的響應。
onTouchStart 觸摸開始
onTouchMove 觸摸滑動
onTouchEnd 觸摸結束
有了這些事件,我們實現用手指在瀏覽器里畫畫就很簡單了。
IPAD上的效果:
思路:當手指觸摸到屏幕的時候在onTouchStart 事件中在手指觸摸的位置上添加一個圓;當手指開始滑動的時候在onTouchMove中不斷的從上一個觸摸點到下一個點畫線條。
HTML:
新聞熱點
疑難解答