点击放大缩小按钮,浏览器内的所有内容都会放大或缩小,包含所有文字、图片,非常不错,用于给弱视全体的网站很有用
查看演示页面 View Demo 查看全部代码 View Code
在网页<body>区添加以下代码
<SCRIPT>
/*****************************************************
* Share JavaScript (http://www.ShareJS.com)
* 使用此脚本程序,请保留此声明
* 获取此脚本以及更多的JavaScript程序,请访问 http://www.ShareJS.com
******************************************************/
<!--
var zoomRate = 20;
var maxRate = 500;
var minRate = 50;
var currZoom = 100;
//document.onkeypress = getKey;
//window.onload = initZoom;
function GetCookie(name){
if (document.cookie != "") {
zoomc = document.cookie.split("; ");
for (var i=0; i < zoomc.length; i++) {
zoomv = zoomc[i].split("=");
if (zoomv[0] == name) {
return unescape(zoomv[1]);
}
}
}else{
return "";
}
}
function SetCookie(name,value){
document.cookie = name + "=" + escape (value)+";";
}
/*function GoZoom(contentid){
if(GetCookie("zoomVal") != null && GetCookie("zoomVal") != ""){
document.all[contentid].style.zoom = GetCookie("zoomVal");
currZoom=GetCookie("zoomVal");
}
else{
document.all[contentid].style.zoom = '100%';
currZoom = '100%';
}
}*/
function zoomInOut(contentid, how) {
if(GetCookie("zoomVal") != null && GetCookie("zoomVal") != ""){
document.all[contentid].style.zoom = GetCookie("zoomVal");
currZoom=GetCookie("zoomVal");
}
else{
document.all[contentid].style.zoom = '100%';
currZoom = '100%';
}
if (((how == "in") && (parseInt(currZoom) >= maxRate)) || ((how == "out") && (parseInt(currZoom) <= minRate)) ) {
return;
}
if (how == "in") {
document.all[contentid].style.zoom = parseInt(document.all[contentid].style.zoom)+zoomRate+'%';
}
else {
document.all[contentid].style.zoom = parseInt(document.all[contentid].style.zoom)-zoomRate+'%'
}
SetCookie("zoomVal",document.all[contentid].style.zoom);
showCurrZoom(contentid);
}
/*
function getKey(keyStroke) {
isNetscape=(document.layers);
eventChooser = (isNetscape) ? keyStroke.which : event.keyCode;
which = String.fromCharCode(eventChooser).toLowerCase();
which2 = eventChooser;
var el=event.srcElement;
if ((el.tagName != "INPUT") && (el.tagName != "TEXTAREA"))
{
if(which == "+" )
zoomInOut('zoom', 'in');
else if(which == "-" )
zoomInOut('zoom', 'out');
}
}*/
function initZoom(contentid) {
if(GetCookie("zoomVal") != null && GetCookie("zoomVal") != ""){
document.all[contentid].style.zoom = GetCookie("zoomVal");
currZoom=GetCookie("zoomVal");
}
else{
document.all[contentid].style.zoom = '100%';
currZoom = '100%';
}
showCurrZoom(contentid);
}
function showCurrZoom(contentid) {
document.all['showZoom'].innerText = document.all[contentid].style.zoom;
}
//-->
</SCRIPT>
<div id="zoom">
<div style="text-align:center">
<h4>
网页手动放大缩小
</h4>
</div>
<div>
<div style="text-align:center" >
<Br>
<a href="http://www.sharejs.com"><img src="http://www.sharejs.com/images/logo.gif" border="0"></a>
<Br>
<br>
<input type="button" value="放大(+)" onclick="zoomInOut('zoom','in')"/> <span id="showZoom"></span> <input type="button" value="缩小(-)" onclick="zoomInOut('zoom','out')"/></div><br/><div style="text-align:center"><br/><script type="text/javascript">initZoom("zoom");</script><br/>




