72、文字放大缩小

72、文字放大缩小

脚本说明:

把如下代码加入<body>区域中

<script language="JavaScript"> 

<!-- 

 

function MM_reloadPage(init) { //reloads the window if Nav4 resized 

if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) { 

document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }} 

else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload(); 

} 

MM_reloadPage(true); 

 

var fsize=12; 

var dx; 

var n; 

 

function changesize(c) { 

if (c==1) { 

if (fsize>0) {fsize--;} 

else {} 

} 

else {fsize++;} 

fonts.innerHTML = fsize + 'px'; 

content.style.fontSize=fsize; 

} 

 

function dragslide() { 

if (n==1) { 

var x=document.body.scrollLeft+event.clientX; 

if ((x-dx)<102&&(x-dx)>0) 

{ 

handle.style.left=x-dx; 

fsize=x-dx+11; 

} 

else if ((x-dx)>101) { 

handle.style.left=101; 

fsize=112; 

} 

else if ((x-dx)<1) { 

handle.style.left=1; 

fsize=12; 

} 

fonts.innerHTML = fsize + 'px'; 

content.style.fontSize=fsize; 

} 

} 

 

function dragstart() { 

n=1; 

dx=document.body.scrollLeft+event.clientX-handle.offsetLeft; 

handle.setCapture(); 

} 

 

function dragend() { 

n=0; 

handle.releaseCapture(); 

} 

//--> 

</script> 

<style type="text/css"> 

<!-- 

.button { height: 14px; width: 14px; font-size: 12px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; margin-left: 0px; padding-top: 0px; padding-right: 0px; padding-bottom: 0px; padding-left: 0px; line-height: 10px}  

.border { border-color: #000000 black; border-style: solid; border-top-width: 1px; border-right-width: 0px; border-bottom-width: 1px; border-left-width: 0px} 

.shadow { filter: DropShadow(Color=#000000, OffX=2, OffY=1, Positive=1)} 

--> 

</style> 

<table width="500" border="0" cellspacing="0" cellpadding="0"> 

<tr> 

<td width="14" height="14"> 

<input type="button" name="Button" value="-" onClick=changesize(1) class="button" onfocus="this.blur()"> 

 

</td> 

<td width="112"> 

<div id="bar" style="font-size:5px;position:relative; width:112px; height:11px; z-index:1; background-color: #D4D0C8; layer-background-color: #D4D0C8; border: 1px none #000000; left: 0px; top: 3px ; " > 

<div id="handle" style="font-size:12px;color:#CDC9C0;cursor: w-resize;position:absolute; width:8px; height:9px; z-index:1; top: 6px; left: 1px" class="shadow" onmousedown="dragstart()" onmousemove="dragslide()" onmouseup="dragend()"></div> 

</div> 

</td> 

<td width="14"> 

<input type="button" name="Submit2" value="+" onClick=changesize(2) class="button" onfocus="this.blur()"> 

</td> 

<td valign="bottom"><span id="fonts" style="font-size:12px;">12px</span></td> 

</tr> 

</table> 

<br> 

<table width="500" border="0" cellspacing="0" cellpadding="0"> 

 

<tr> 

<td id="content" style="font-size:12px">欢迎7stk.com</td> 

</tr> 

</table> 

 

Write a comment

Comments: 0