繪製到背景

我正在創建一個網站，讓用戶使用他選擇的顏色繪製背景。我也想讓用戶使用十六進制顏色選擇器工具更改背景顏色。繪製到背景

後者很容易，但我怎麼讓用戶畫到背景？是否可以使用畫布作爲背景？

我應該創建整個背景整個小的div的顏色，我會改變，當用戶正在繪製？

來源

2015-04-25 unska

如果用戶可以選擇一種顏色，我應該有一個笑着'工作div'放置在背景，但如果他能與多種顏色畫我會使用的東西像''或''

代碼你目前有？ – digitalextremist

如果它在後臺，您可能會遇到Z-index分層的問題。爲什麼它在後臺如果被吸引？我們是否應該假設你會在它之上放置更多的內容，而這些內容是不會被吸引的？ – ThisClark

最好的方法確實是使用<canvas>。

Here您可以找到關於如何使用HTML5畫布創建繪圖應用程序的深入教程。祝你好運。

來源

2015-04-25 13:05:02 Amir

這是一個僅鏈接的答案。充實你的回答，這樣如果鏈接在未來消失，這裏仍然有價值。 – digitalextremist

確實，最好的方法是創建一個畫布作爲背景。根據你給IE的支持（當然，如果你需要IE8的話），請使用excanvas。

創建一個畫布，使用CSS定位它（或它的內容，無論位置）
綁定拾色器並相應地更新畫布（使用clearRect，然後用同顏色的新矩形填充你選擇）
你完成了！

你需要檢查：變種C =的document.getElementById（「myCanvas」）; var ctx = c.getContext（「2d」）; var canvasWidth = 100; //在此處獲取。 var canvasHeight = 100; //在此處獲取。 ctx.rect（0，0，canvasWidth，canvasHeight）; ctx.fillStyle =「YOURCOLOR」; ctx.fill（）;

不要忘記更新您的畫布的維度，如果你沒有使用它，響應部分！

如果用戶更新了顏色，然後用清除矩形：

ctx.clearRect()

然後，重新設置新的顏色。

來源

2015-04-25 13:09:16 Ninir

回答

相關問題