0
987
Vistas¿Cómo restablecer el zoom (después de pellizcar el zoom) en una página web desde Javascript?
Estoy trabajando en una antigua aplicación basada en cordova. En mi página tengo un iframe donde muestro archivos PDF (usando la biblioteca PDFJS). El usuario puede hacer zoom en el área del PDF, ya sea usando los botones de zoom en el visor de PDF o haciendo zoom con los dedos. El requisito es que cuando el usuario hace clic en un botón en la página principal (área sin iframe), tengo que restablecer el nivel de zoom del PDF a la normalidad.
Puedo hacer esto si el zoom se realiza a través de los botones de zoom usando el siguiente código (específico de PDFJS)
document.getElementById("myPdf").contentWindow.PDFViewerApplication.pdfViewer.currentScaleValue = 'auto';
Pero si el zoom se realiza con el zoom de pellizco, no puedo restablecer (cuando se realiza el zoom de pellizco, el HTML completo que se carga en iframe se amplía, por lo que es un zoom de página web). Intenté el siguiente código para restablecer la escala inicial pero no funciona
document.querySelector("meta[name=viewport]").setAttribute( 'content', 'width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0');¿Alguien podría sugerir una manera de hacer esto?
1 Respuestas
Responde la pregunta0
Puede intentar manipular la propiedad .style.zoom en el elemento de destino deseado:
const zoomingTarget = document.querySelector('.zooming-target') Después de tomar el elemento deseado, cuyo zoom desea restablecer, puede cambiar la propiedad .style.zoom en él:
zoomingTarget.style.zoom = "calc(100% + " + zoomIndex*10 + "%)";Implementación con dos botones-> Cambiar el nivel de zoom del navegador