javascript全棧開發實踐 web 2

2021-09-24 08:23:40 字數 792 閱讀 9888

我們目前僅僅測試實現了鉛筆的功能。接下來我們繼續增加乙個新的功能:螢光筆。螢光筆通常是帶有一定顏色,並且具有半透明特性,可以把下面的字跡顯露出來。 而為了在鉛筆和螢光筆之間進行切換,我們就需要增加兩個按鈕,來實現這個切換功能。 **如下:

'background:lightgrey'>

'pencil' onclick="handlechoosepencil()">pencil

'highlighter' onclick="handlechoosehighlighter()">highlighter

'pad' width='800px' height='600px' style='background:white'>

複製**

首先,我們在html裡面增加了兩個按鈕,並且分別繫結了事件。然後在事件響應方法裡面,我們去設定畫筆的顏色和粗細。其中給螢光筆設定了半透明。 如果我們只做了這一點修改,那麼你會發現,螢光筆畫出來的顏色一點都不透明。原因在於。我們之前的**裡面,只在handlemousedown裡面呼叫了一次beginpath,然後讓畫筆不斷移動,然後呼叫stroke去顯示這條路徑。結果會導致,每次移動滑鼠的時候,呼叫stroke顯示的是從上一次beginpath之後記錄的所有的路徑,因此,在mouse move的時候,我們會重複繪製多次之前的路徑,結果就導致半透明顏色疊加之後變成了不透明。

要解決這個問題,就需要每次移動滑鼠,我們就繪製當次滑鼠移動的路徑,然後開啟乙個新的路徑,這樣下次繪製的時候,不會重複繪製之前已經畫好的路徑。 所以我們也修改了handlemousedown。 接下來,我們會增加橡皮擦功能。

Python Web 全棧開發(一)

web 和伺服器 框架 django 2.建立完畢後進入專案,可以看到 django 初始的 py 檔案 3.開啟終端,可以輸入 python manage.py runserver 執行開發伺服器 4.出現報錯,根據報錯資訊,在setting.py中import os,再次執行,在瀏覽器輸入 即可...

Python 全棧開發 監控篇

如果你已經玩轉了 python 程式語言語法,肯定想用這些知識,開發一款應用程式,它可以是在網上,可以炫耀或 那就需要全棧式開發 python。具體如何建立,部署和執行生產 python web 應用程式,參考 full stack python,本文主要介紹一點,監控。為什麼要監控?web 應用程...

Python全棧開發之MySQL

smartypants將ascii標點字元轉換為 智慧型 印刷標點html實體。例如 type ascii html single backticks isn t this fun?isn t this fun?quotes isn t this fun?isn t this fun?dashes ...