文件:mozSetImageElement() 方法
非標準:此特性未標準化。我們不建議在生產環境中使用非標準特性,因為它們瀏覽器支援有限,並且可能會更改或被移除。但是,在沒有標準選項的特定情況下,它們可以是合適的替代方案。
Document.mozSetImageElement() 方法用於更改一個具有給定背景元素 ID 的背景所使用的元素。該方法會將指定元素設定為 CSS 背景。
語法
js
mozSetImageElement(imageElementId, imageElement)
引數
imageElementId-
一個字串,指示一個已經透過
-moz-elementCSS 函式指定為背景影像的元素的名稱。 imageElement-
與該 imageElement 字串對應的,用作背景的新元素。指定
null以移除背景元素。
返回值
無(undefined)。
示例
此示例將在使用者每次點選 <div> 塊時更改該塊的背景。
css
#my-box {
background-image: -moz-element(#canvas-bg);
text-align: center;
width: 400px;
height: 400px;
cursor: pointer;
}
上面定義的 CSS 由我們的 <div> 使用,它將 ID 為 "canvas-bg" 的元素用作其背景。
js
let c = 0x00;
function clicked() {
const canvas = document.createElement("canvas");
canvas.setAttribute("width", 100);
canvas.setAttribute("height", 100);
const ctx = canvas.getContext("2d");
ctx.fillStyle = `#${c.toString(16)}0000`;
ctx.fillRect(25, 25, 75, 75);
c += 0x11;
if (c > 0xff) {
c = 0x00;
}
document.mozSetImageElement("canvas-bg", canvas);
}
這裡的程式碼在使用者每次點選 <div> 元素時被呼叫。它會建立一個新的 <canvas>,其寬度和高度均設定為 100 畫素,然後在其上繪製一個 50x50 畫素的正方形。每次呼叫該函式時,正方形的顏色都會不同(其紅色分量每次都會增加),因此每次使用者點選該元素時,背景都會填充越來越亮的紅色瓷磚圖案。
繪製完 canvas 後,會呼叫 document.mozSetImageElement() 方法,將任何使用 ID "canvas-bg" 作為其背景元素 ID 的 CSS 的背景設定為我們新建立的 canvas。
規範
不屬於任何規範。
瀏覽器相容性
載入中…