Tengo una aplicación web que toma fotos y estoy tratando de implementar un flash para selfies. Sin embargo, esto no funciona en los casos en que un usuario tiene el brillo reducido. ¿Es posible ajustar el brillo de la pantalla de un dispositivo en una aplicación web?
Estoy usando una superposición blanca como flash e intenté aumentar el brillo usando CSS, pero no tuvo ningún impacto ya que la superposición ya es 100% blanca.
Tal vez esto pueda ayudar
function fun(e) { var container = document.getElementById('container'); var val = e.value; container.setAttribute("style", "filter: brightness("+val+"%);"); } body { margin: 0; padding: 0; } #container { display: flex; align-items: center; justify-content: center; height: 100vh; background: #22438C; } .main { width: 500px; background: #FFF; border-radius: 10px; padding: 40px; } #brightness-range { width: 100%; -webkit-appearance: none; background: #E40404; height: 10px; outline: none; cursor: pointer; } #brightness-range::-webkit-slider-thumb { -webkit-appearance: none; width: 25px; height: 25px; border-radius: 50%; cursor: pointer; background: #22438C; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="utf-8"> <title>Change Brightness using Range Slider</title> <link rel="stylesheet" href="style.css"> </head> <body> <div id="container"> <div class="main"> <input type="range" id="brightness-range" min="10" max="100" value="100" onchange="fun(this)"> </div> </div> </body> </html>