CSS 缩放在 IE11 中不起作用

css zoom not working in ie11

本文关键字：不起作用 IE11 缩放 CSS      更新时间：2023-09-26

我正在使用角度构建一个应用程序。它应该在平板电脑和支持触摸的设备上运行。

我想让用户能够缩放/放大应用程序，适合视力不佳和手指笨拙的人。为此，我使用此脚本，该脚本在用户单击缩放按钮时执行： 这是代码

<!--code start -->  
$scope.zoomLevel+= 0.1;
$('body').css({
   zoom: $scope.zoomLevel
});

这在 chrome 中完美运行，但在 IE11 中什么也没做。

我正在使用twitter bootstrap，angular和jquery。

在 jsFiddle 中测试它时，我完全能够在 IE 中使用缩放，所以我猜我或某些第三方库正在设置一个影响 IE 中缩放属性的属性。

  • 这是什么？

PS：我不介意它在火狐中不起作用。此应用将始终在 IE11 中运行。

zoom属性是一个较旧的功能，今天真的不应该被利用。它的跨浏览器支持很差，不属于正式的标准，因此我(IE团队的工程师(鼓励你找到一种更符合标准的方法。

从版本 9 开始，Internet Explorer 支持 CSS 转换和缩放函数。此特定功能具有更好的跨浏览器支持，并且足以满足您的需求。我创建了一个小提琴，并排显示缩放和缩放，以确认体验的相似性。

小提琴：http://jsfiddle.net/jonathansampson/hy5vup49/2/

在评论中进行一些讨论后，您指出了zoom缩放和转换缩放之间的有效布局差异。如果您希望实现跨浏览器zoom效果，我建议您考虑在项目中使用 em 或rem单位，并利用字体大小继承作为缩放机制。

小提琴：http://jsfiddle.net/jonathansampson/024krs33/

相关文章：