2022年05月13日 16:48 阅读量:738
提供直接进入适老化服务的网站快捷通道,目前主要功能有大字块、鼠标样式和声音功能。
步骤一:引用js
<!--适老模式 -->
<script type="text/javascript" src="/canyou/js/jquery.min.js"></script>
<script type="text/javascript" src="/canyou/js/wza.min.js"></script>
步骤二:引用css,长辈适老化样式,需要根据原网站的样式定制修改.
<!--适老模式样式定制 -->
<link rel="stylesheet" href="/canyou/themes/res/elder.css" type="text/css" />
步骤三:在原网站模板页面添加a标签,如下
<a id="wzaElder" class="wzaElder" style="display: inline-block;background: #ff9027;color: #fff !important;" href="javascript:void(0);">开始适老模式</a>
wza_elder.js 代码参考如下:
$(document).ready(function (a) {
if (sessionStorage.getItem("elder") && sessionStorage.getItem("elder") == "开始适老模式") {
$("#wzaElder").text("关闭适老模式")
$("body").addClass("elderClass")
} else {
$("#wzaElder").text("开始适老模式")
$("body").removeClass("elderClass")
}
$("#wzaElder").click(function () {
if ($(this).text() == "开始适老模式") {
$(this).text("关闭适老模式")
sessionStorage.setItem("elder", "开始适老模式");
$("body").addClass("elderClass")
} else {
$(this).text("开始适老模式")
sessionStorage.setItem("elder", "关闭适老模式");
$("body").removeClass("elderClass")
}
});
});