jquery - 如何在点击时进行浏览器放大效果

Question

我想在用户单击按钮时添加浏览器缩放效果。这适用于老年人，因此他们可以放大文本以使其更易于阅读。我不想让实际文本变大，因为它会弄乱网页的布局。我怎样才能做到这一点？

我已经在几个实现类似的网站上看到了 AAA 按钮。

Answer 1

直接浏览器控制本身不应该由脚本驱动，在某些情况下会很危险。浏览器以不同的方式实现缩放，据我所知，没有“本机 API”可以做到这一点。

您最接近的是更改图像和字体大小。我知道，这不是您希望的答案。

Answer 2

我想说，如果您需要，您可以创建 3 个不同的按钮来切换标签上的活动类，并且每个类都应该有一些字体大小定义。

<a data-size="small">small</a>
<a data-size="normal">normal</a>
<a data-size="large">large</a>

$("a").on("click", function(){
    $("html").removeClass().addClass($(this).data("size"));
});

html.small{font-size:12px;}
html.normal{font-size:20px;}
html.large{font-size:36px;}