插件描述：jQuery字體縮放縮放插件zoomFontSize.js根據父類進行百分比縮放，兼容性如下：
使用方法
body 的class屬性 添加 changbody_fontSize 而且整個頁面的字體屬性設為百分比（body除外）
缺點：
1.需要根據父類進行百分比 縮放
2.Chrome 字體縮放最小值為12px 就無法進行縮放
插件源碼：
1 // JavaScript Document 2 //屏幕的寬度 3 //屏幕的寬度 4 var width_srceen = screen.width ; 5 var font_size = ""; 6 //窗口縮放時執行 7 window.onresize=function(){ 8 changbody_fontSize(".chang_fontSize"); 9 } 10 //加載時執行 11 window.onload = function(){ 12 $("html").css("-webkit-text-size-adjust" 13 ,"none"); 14 font_size = $(".chang_fontSize").css("font-size").split("px")[0]; 15 changbody_fontSize(); 16 } 17 //根據屏幕的寬度與窗體的倍數進行字體的縮放 18 function changbody_fontSize(obj){ 19 var new_window_width = $(window).width(); 20 var multiple =new_window_width/width_srceen; 21 var hi =font_size * multiple; 22 $(".chang_fontSize").css("font-size" ,hi+"px" ); 23 } 24
實例：
1 <!DOCTYPE html> 2 <html xmlns="http://www.w3.org/1999/xhtml"> 3 <head> 4 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 5 <title>字體縮放</title> 6 <script src="jquery-1.10.2.min.js"></script> 7 <script src="zoomFontSize.js"></script> 8 <style> 9 body{ 10 font-size:26px; 11 } 12 .size52px{ 13 font-size:200%; 14 } 15 16 .size26px{ 17 font-size:100%; 18 } 19 ul li{ 20 padding-bottom:40px; 21 } 22 .Explain{ 23 margin-top:100px; 24 font-size:80%; 25 margin-bottom:200px; 26 } 27 .Explain ul li{ 28 padding-bottom:2px; 29 } 30 31 </style> 32 </head> 33 <body class="chang_fontSize"> 34 <div class="Explain"> 35 使用方法：body 的 class屬性 添加 changbody_fontSize 而且整個頁面的字體屬性設為百分比（body除外） <br /> 36 缺點：<ul> 37 <li>1.需要根據父類進行百分比 縮放</li> 38 <li>2.Chrome 字體縮放最小值為12px 就無法進行縮放</li> 39 </ul> 40 </div> 41 <div class="size52px"> 42 全局縮放：<br /> 43 <ul> 44 <li style="font-size:100%;color:#c0f"> 45 當前類為是父類的百分之100%（52px)-(body:26px; 父類body的200%[52px]) 46 </li> 47 <li style="font-size:50%;color:#f00"> 48 當前類為是父類的百分之50%（26px）-(body:26px; 父類body的200%[52px]) 49 </li> 50 <li style="font-size:40%;color:#000"> 51 當前類為是父類的百分之20%（20.8px）-(body:26px; 父類body的200%[52px]) 52 </li> 53 </ul> 54 </div> 55 <div style="font-size:26px;"> 56 局部縮放：<br /> 57 <ul class="chang_fontSize"> 58 <li style="font-size:100%;color:#c0f"> 59 當前類為是父類的100%;(26px)-(父類為：26px) 60 </li> 61 <li style="font-size:80%;color:#f00"> 62 當前類為是父類的80%;(20.8px)-(父類為：26px) 63 </li> 64 <li style="font-size:50%;color:#000"> 65 當前類為是父類的50%;(20.8px)-(父類為：26px) 66 67 </li> 68 </ul> 69 </div> 70 </body> 71 </html>