使用 Dojo 开发支持 Accessibility 的 Web 应用
2009-11-05 00:00:00 来源:WEB开发网dojo.query(".big").style("fontSize","150%");
// 将页面上所有具有 big 这种 css 类的节点的字体大小设置成 150%;
当然不使用 CSS 而去使用 JavaScript 定义字体大小是不常见的,但是对于某些对浏览器应用不熟悉的视力有问题的用户来说,我们可以在网页的显眼位置设置增大、缩小文字的按钮,用户通过点击这两个按钮,而不需要掌握浏览器伸缩字体的方式,就能够放大、缩小网页上的字,很显然,这种按钮的背后就是上面使用 Dojo 的例子那样的 JavaScript 在起作用。
而更加人性化,完备的解决方案则是多样式表的提供,比如说专门为视力弱小的人群提供 a11y 形式的 CSS, 用户可以自主的选择这种样式为整个网页换肤,并且,浏览器通过 cookies 记录下来用户的偏好样式,以后每当该用户重新访问该网页的时候,就使用之前用户选择的 a11y 的 CSS 进行呈现,下面是一个使用 Dojo 动态替换样式表的例子:
在 HTML 文件中指定了默认的 CSS 样式文件
<link id="theme" type="text/css" rel="stylesheet" href="default.css"/>
用户点击 changeThemeButton 切换到 a11y 的 CSS, 使用 Dojo 可以很方便的做到:
dojo.require("dojo.cookie");
var changeThemeButton = dojo.byId("changeThemeButton");
function changeTheme(){
var styleObj = dojo.byId("theme");
var src= "a11y.css";
dojo.attr(styleObj, "href", src); //设置新的样式
dojo.cookie("style", src); //设置 cookies
}
//使用 dojo 的 event connect 机制,用户点击 changeThemeButton,将触发 changeTheme 方法
dojo.connect(changeThemeButton, "onclick", changeTheme);
- ››使用脚本恢复WinXP系统的用户登录密码
- ››开发学院教你用SQL 语句最快速清空MySQL 数据表的...
- ››使用phpMyadmin创建数据库及独立数据库帐号
- ››使用Zend Framework框架中的Zend_Mail模块发送邮件...
- ››使用cout标准输出如何控制小数点后位数
- ››使用nofollow标签做SEO的技巧
- ››使用 WebSphere Message Broker 的 WebSphere Tra...
- ››使用SQL Server事件探查器做应用程序的性能分析
- ››使用SQL Server事件探查器分析死锁原因
- ››使用纯文本文件打造WCF服务
- ››使用 Dojo 开发定制 Business Space 小部件,第 4...
- ››使用 ADDRESS 与 INDIRECT函数查询信息
更多精彩
赞助商链接