缩放时保留元素大小和位置

Retain element size and position when zoomed

本文关键字：位置 元素 保留 缩放      更新时间：2023-09-26

当浏览器放大时，我如何保持元素的默认大小。我的目标是保留元素的默认大小和位置，无论用户放大或缩小了多少百分比。

我遇到了一些有用的css属性，转换比例和转换原点，但我还没能实现我的目标。缩放比例与缩放级别不匹配。

有人能给我一些建议吗。

var defaultScale = 1.0;
var zoomLevel = document.documentElement.clientWidth / window.innerWidth;
var scale = defaultScale - (zoomLevel - defaultScale);
$('.popup-overlay').css('-webkit-transform', 'scale(' + scale + ')');

当弹出窗口出现时，您可以测量浏览器窗口和弹出窗口的宽度，然后计算设置弹出窗口在屏幕上的百分比宽度。缩放时应保持百分比。

var popwidth = $('.popup-overlay').width();
var windowWidth = window.innerWidth;
var popercentage = (parseInt(popwidth)/parseInt(windowWidth))*100;
$('.popup-overlay').css('width',popercentage+'%');
相关文章：