0
222
Vistas¿Hay alguna forma de seleccionar a través de elementos CSS dentro del iframe de UMAP?
Estoy mostrando un mapa de uMap en mi sitio web. Aquí está :
<iframe id="umapiframe" class="iframe-umap" width="100%" height="300px" frameborder="0" allowfullscreen src="//umap.openstreetmap.fr/fr/map/agroavenir_665397?scaleControl=false&miniMap=false&scrollWheelZoom=false&zoomControl=true&allowEdit=false&moreControl=true&searchControl=null&tilelayersControl=null&embedControl=null&datalayersControl=true&onLoadPanel=none&captionBar=false"></iframe>De hecho, se ve muy bien, excepto que realmente quiero cambiar algo de CSS en su interior. Aquí, quiero reemplazar los botones de navegación en la esquina inferior/derecha, excepto en la parte superior/izquierda:
Como puede ver, en la segunda imagen, pude modificar localmente el CSS solo para ver un resultado potencial, ¡y en realidad es exactamente lo que quiero!
Pero el elemento en realidad está dentro de un documento iframe y, a través de eso, no puedo alcanzar el elemento al que quiero llegar en mi archivo css.
Estoy un poco frustrado por no poder hacer permanentes este tipo de cosas, mostrándose perfectamente frente a mí...
¿Hay alguna forma de llegar a través del selector de CSS al interior de este iframe? ¿O, de otra manera, moviendo esos elementos en la otra esquina?
Gracias por leer
2 Respuestas
Responde la pregunta0
Hasta donde yo sé, con CSS puede seleccionar solo clases en el mismo documento e iframe es un documento completamente nuevo, por lo que la respuesta sería que no puede. Tal vez puedas intentar orientarlo con javascript.
Ejemplo de código:
document.querySelector('iframe').contentDocument.body.querySelector('#some-element').style.background-color = 'red';0
Puede obtener un elemento dentro de un iframe usando este código:
const iframe = document.querySelector(/**iframe selector**/) iframe.contentWindow.document.querySelector(/**element selector**/)Luego dale estilo con js.
Preguntas relacionadas:
Cómo elegir un elemento dentro de iframe usando document.getElementById