canvas設定透明度
分享一段程式碼例項,它實現了設定canvas圖形透明度的功能。
程式碼例項如下:
[HTML] 純文字檢視 複製程式碼執行程式碼<!doctype html> <html> <head> <meta charset="utf-8"> <meta name="author" content="http://www.softwhy.com/" /> <title>螞蟻部落</title> <script> window.onload = function () { var c = document.getElementById("canvas"); var ctx = c.getContext("2d"); //設定矩形的透明度 ctx.fillStyle = "rgba(20, 50, 40, 0.3)"; ctx.fillRect(10, 10, 100, 50); ctx.stroke(); } </script> </head> <body> <canvas id="canvas" width="400" height="450"></canvas> </body> </html>
上面的程式碼實現了設定矩形透明度的功能,使用fillStyle屬性即可實現設定,屬性值為RGBA顏色值。
更多內容可以參閱canvas 設定透明度詳解一章節。
相關文章
- canvas 設定透明度Canvas
- jQuey設定透明度
- CSS 透明度設定CSS
- JavaScript設定元素透明度JavaScript
- jQuery設定透明度效果jQuery
- canvas透明度的矩形效果Canvas
- CSS 設定邊框透明度CSS
- Android 設定TextView透明度AndroidTextView
- 使用jquery設定元素的透明度jQuery
- JavaScript漸變方式設定透明度JavaScript
- svg以動畫方式設定透明度SVG動畫
- SVG 填充、描邊和透明度設定SVG
- 使用javascript設定圖片的透明度JavaScript
- 利用jquery設定div元素的透明度jQuery
- jQuery動畫方式設定元素的透明度jQuery動畫
- 以動畫方式設定元素的透明度動畫
- Android 之 View透明度的設定AndroidView
- canvas設定陰影效果Canvas
- canvas 設定矩形樣式Canvas
- canvas—元素樣式設定Canvas
- CSS3漸變方式設定透明度CSSS3
- jQuery以動畫方式設定元素的透明度jQuery動畫
- JavaScript 動畫方式設定元素尺寸和透明度JavaScript動畫
- Android 設定圖片 Bitmap任意透明度Android
- opacity設定元素透明度程式碼例項
- canvas 設定線條的樣式Canvas
- CSS3顏色不透明度如何設定CSSS3
- js動態設定元素透明度程式碼例項JS
- 相容所有瀏覽器js設定元素透明度效果瀏覽器JS
- SVG設定邊框的透明度程式碼例項SVG
- win10工作列透明度設定方法_win10如何調整工作列透明度Win10
- CSS與canvas屬性設定畫布尺寸CSSCanvas
- CSS 與 canvas 屬性設定畫布尺寸CSSCanvas
- 不咕剪輯APP設定視訊字幕的透明度的方法APP
- javascript實現的動態設定元素透明度程式碼例項JavaScript
- javascript相容所有瀏覽器設定元素透明度程式碼例項JavaScript瀏覽器
- css設定canvas畫布尺寸與width和height設定的區別CSSCanvas
- CSS和canvas標籤設定畫布尺寸區別CSSCanvas