Escribí un sitio web el año pasado usando html, css y js sin procesar, pero he estado intentando reconstruir mi código con reaccionar como un buen ejercicio para aprender la herramienta. Me di cuenta de que mi antiguo código para restablecer mi imagen de fondo ya no funciona si uso un directorio de imágenes local dentro del puntero url(...) que contiene un paso en una carpeta, y solo funciona con direcciones URL http:// reales o los que no contienen una url; ex. url('image.png') o url('./image.png') . Cuando se ejecuta el nuevo código, backgroundImage desaparece si se usa un png local. Me he estado rascando la cabeza durante algún tiempo, así que agradecería cualquier ayuda.
Código antiguo:
function randombg(){ var random= Math.floor(Math.random() * 2) + 1; var bigSize = ["url('background-images/1.png')", "url('background-images/2.png')", ... document.getElementById("random").style.backgroundImage=bigSize[random]; }CSS:
#random { width: 100%; height: 100vh; background-image: url('assets/background-images/1.png'); background-repeat: repeat; position: absolute; z-index: -1; }El nuevo código es el mismo pero usa una función de reacción para ejecutar js (handleClick(e) {...}).