这是
实验性技术
检查
浏览器兼容性表格
要小心谨慎在生产中使用这之前。
The ambient light events are a handy way to make a web page or an application aware of any change in the light intensity. It allows them to react to such a change, for example by changing the color contrast of the User Interface (UI) or by changing the exposure necessary to take a picture.
When the light sensor of a device detects a change in the light level, it notifies the browser of that change. When the browser gets such a notification, it fires a
DeviceLightEvent
event that provides information about the exact light intensity (in lux units).
此事件可以被捕获在
window
对象级别通过使用
addEventListener
方法 (使用
devicelight
事件名称) 或通过把事件处理程序附加到
window.ondevicelight
特性。
Once captured, the event object gives access to the light intensity expressed in
lux
透过
DeviceLightEvent.value
特性。
if ('ondevicelight' in window) {
window.addEventListener('devicelight', function(event) {
var body = document.querySelector('body');
if (event.value < 50) {
body.classList.add('darklight');
body.classList.remove('brightlight');
} else {
body.classList.add('brightlight');
body.classList.remove('darklight');
}
});
} else {
console.log('devicelight event not supported');
}
| 规范 | 状态 | 注释 |
|---|---|---|
|
Ambient Light Sensor
The definition of 'Ambient Light Events' in that specification. |
候选推荐 | 初始定义 |
| 桌面 | 移动 | |||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
DeviceLightEvent
非标
|
Chrome No | Edge ≤18 — 79 |
Firefox
62
Disabled
|
IE No | Opera No | Safari No | WebView Android No | Chrome Android No |
Firefox Android
62
Disabled
|
Opera Android No | Safari iOS No | Samsung Internet Android No |
value
非标
|
Chrome No | Edge 13 — 79 |
Firefox
62
Disabled
|
IE No | Opera No | Safari No | WebView Android No | Chrome Android No |
Firefox Android
62
Disabled
|
Opera Android No | Safari iOS No | Samsung Internet Android No |
完整支持
不支持
实验。期望将来行为有所改变。
非标。预期跨浏览器支持较差。
见实现注意事项。
用户必须明确启用此特征。