Soy muy nuevo en las extensiones de Chrome, y navegarlo es mucho autoaprendizaje. ¡Esperaba que alguien pudiera ayudarme con este simple problema que tengo!
Quiero tener una ventana emergente muy pequeña, que muestre un libro cerrado al hacer clic en el ícono de extensión. Una vez hecho clic, quiero que cambie a un libro abierto, lo que indica que está "activo". Actualmente tengo un archivo manifest.json, un archivo emergente predeterminado con un archivo css para diseñar y un archivo js también, y tengo una página de fondo en js.
No estoy seguro de cómo cambiar la imagen del libro dentro de la ventana emergente.
(imagen enlazada en el texto)
Si puede simplemente cambiar algo como el atributo src, puede ser el método más fácil. Si necesita tener dos elementos diferentes, es posible que desee mostrarlos/ocultarlos usando el atributo de estilo y hacer clic en un div principal de los dos elementos secundarios.
<img src="/pathToOpenBook" onclick="toggleBookOpen" alt="imageDesc" /> function toggleBookOpen(pointerEvent){ const openBook = "/pathToOpenBook"; const closedBook = "/pathToClosedBook"; const element = pointerEvent.target; const src = element.getAttribute('src'); const isOpen = src.toLowerCase().includes('open'); const updateValue = isOpen ? closedBook : openBook; element.setAttribute('src', updateValue); }