Estoy un poco corto de personal y he estado tratando de resolver un problema con un sitio web.
Estoy refactorizando un sitio que anteriormente usaba fancybox para abrir la Política de privacidad (privacy.php) o los Términos y condiciones (terms.php) en lo que parecía ser un modal o una overlay . Idealmente, me gustaría activar un evento onclick (o similar) en una etiqueta de anclaje, luego mostrar el contenido correspondiente de privacy.php o terms.php en el modal o la superposición. Simplemente quiero que se muestre sobre la página actual con un ancho de aproximadamente el 80%, para que los visitantes puedan leer los Términos y condiciones o la Política de privacidad sin salir de la página o iniciar un evento emergente o window.open .
Mis disculpas por no incluir el código. Principalmente intento encontrar los recursos adecuados para comenzar.
Puede crear un iframe absolutamente posicionado con un índice z positivo (más alto que cualquier otro índice z en su página), estableciendo la fuente del marco en su página de privacy.php .
Código aproximado:
const iframe = document.createElement("iframe"); iframe.src = "privacy.php"; iframe.className = "privacy-overlay"; document.body.appendChild(iframe);...con este CSS:
.privacy-overlay { position: absolute; left: 10%; top: 10%; width: 80%; height: 80%; }...o similar.
O puede envolverlo en un div con un botón para eliminarlo:
const div = document.createElement("div"); const closeButton = document.createElement("button"); closeButton.textContent = "Close"; div.appendChild(closeButton); const iframe = document.createElement("iframe"); iframe.src = "privacy.php"; div.appendChild(iframe); div.className = "privacy-overlay"; document.body.appendChild(div); button.addEventListener("click", () => { document.body.removeChild(div); });...con un estilo CSS adecuado para organizar los elementos dentro del div.