为什么我的放大文本大小的辅助工具不起作用？答案

【问题标题】：Why isn't my accessibility tool of enlarging text size working?为什么我的放大文本大小的辅助工具不起作用？
【发布时间】：2015-07-23 00:52:48
【问题描述】：

我正在添加一个可访问性工具，用户可以增加页面上所有文本的字体大小，并且如果他们愿意，还可以返回到默认字体大小。我制作了第二个 CSS 文件，其中包含用于增加文本的 CSS 规则。但是，当我单击为文本较大/文本较小制作的图标时，它不起作用。有人能理解为什么吗？感谢您的帮助。

首页的HTML代码：

<div id="font-size-buttons">
   <a href="#" onclick="changeCSS('notaccessible.css', 2);"><img src="http://www.me14ch.leedsnewmedia.net/slate/images2/fontmin.png" width="25" height"25" alt="Switch to original text size and colours"></a>
  <a href="#" onclick="changeCSS('stylesheet.css', 2);"><img src="http://www.me14ch.leedsnewmedia.net/slate/images2/fontmax.png" width="30" height="30" alt="Switch to larger text and improved colour contrast"></a>
  </div>

一些默认的 CSS 样式表代码：

.body {
height: 100%;
overflow: auto;
padding-bottom: 25px;
font-size: 0.75em;

}
/* accessibility */

#font-size-buttons {
    float: right;
    clear: both;
    margin-right: 5px;

}

还有来自替代样式表的 CSS：

body {
    font-size: 1.5em;

}

还有我的 index.html 页面顶部的链接样式表代码：

    <link href="stylesheet.css" rel="stylesheet" type="text/css" />
<link href="http://me14ch.leedsnewmedia.net/slate/notaccessible.css" rel=alternate stylesheet" type="text/css" title="access"/>

网站链接：www.me14ch.leedsnewmedia.net/slate

【问题讨论】：

标签： html css fonts size

【解决方案1】：

那是因为changeCSS 没有定义。

在onclick="...."> 中，您执行一段Javascript，在您的例子中，是一个名为changeCSS 的函数，变量为'notaccessible.css' 和2。

但是在你的代码中没有一个函数叫做changeCSS。因此，您要么必须编写该函数，要么更改您的 html。

[编辑]

made a little example fiddle

【讨论】：

啊，是的，我明白你的意思。我是 javascript 新手，我该如何定义它？
您可以通过将<script type="text/javascript" src="myscript.js"></script> 放在<head>..</head> 标记之间来加载外部javascript 文件。在这个文件中，你可以编写你想要的所有 javascript，包括一个名为 changeCSS 的函数来更改字体大小。
我了解如何链接到外部 js 文件，只是不知道如何编写函数，并且正在努力寻找任何有意义的在线教程
给你做个小例子，fiddle就是答案。您可能还想查看 cookie，以保存用户偏好。否则每次有人访问您的网站时，他或她都必须更改字体大小。
非常感谢您的宝贵时间和帮助！