Zoom out on a local page [support IE, Chrome browser]
Last Update:2017-08-24
Source: Internet
Author: User
Keywords
Web page production
Ajax
javascript
<! doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http:// Www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <html xmlns=" http://www.w3.org/1999/xhtml " > <head> <meta http-equiv= "Content-type" content= "text/html; charset= gb2312 " /> <title> Untitled document </title> <script type=" Text/javascript " src= "Jquery-1.4.2.min.js" ></script> <script> var i=0; var tdata={head:[{name: ' noun '},{name: ' Quantity '}],data:[{name: ' Language ', Count:12},{name: ' Mathematics ', count:30}]}; Function addnewrow () { $ ("#tt"). Append ("<tr id= ' Tr_" +i+ "' ><td>" +i+ "< Input name= ' FDSA ' type= ' text ' ></td><td><button onclick= ' removeThis ("+i+"); ' > Delete </button></td></tr> "); i++; } Function removethis (IDs) { $ ("#tr_" +ids). Remove (); i--; } Function reposition () { $ ("#bottomdiv"). CSS ("Margin-top", $ (window). Height ()-$ ("# Bottomdiv "). Height ()-2); $ ("#bottomdiv"). CSS ("Margin-left", $ (window). Width ()-$ ("#bottomdiv"). Width ()-2); $ ("#tt tbody"). Append ("<tr>"); $.each (tdata.head,function (i,row) { $ ("#tt tbody"). Append ("<th> +row.name+") </th> "); }); $ ("#tt tbody"). Append ("</tr>"); $.each (tdata.data,function (i,row) { $ ("#tt tbody"). Append ("<tr><td>" + Row.name+ "</td><td>" +row.count+ "</td></tr>"); }; } $ (function () {reposition (); $ ("#div_animate"). Animate ({ height: ' Toggle ', opacity: ' Toggle ' }, ' slow '; $ ("#div_animate"). Animate ({ height: ' show ', opacity: ' show ') }, "slow"); }); var zoom=10; Function maxzoom () { zoom+=5 $ ("#zoomdiv"). CSS ("Zoom", ZOOM/10); } function minzoom () { if (zoom<=0) { zoom=5; }else{ zoom-=5 } $ ("#zoomdiv"). CSS ("Zoom", ZOOM/10); } var inobj=null; Function inputtime () { } </script> <style type= "Text/css" > Body{ margin:0 0 0 0} button{padding-top:3px;} Input {padding-top : 3px;} #ddiv {overflow:auto;float:left;width:800px;height:300px} </style> </head> <body> <button onclick= "Addnewrow ();" > Add </button><button onclick= "Maxzoom ();" > Enlarge </button><button onclick= "minzoom ();" > Zoom </button> <div id= "Ddiv" > <div id= "Zoomdiv" > <table Id= "TT"> <tbody> </tbody> </table> <input type=" button " value= "button" > </div> </div> <div id= "Timeseler" > <select Id= "Hour" > <script>for (var i=0;i<24;i++) { document.write ("<option>" + (i<10?) 0 "+i": i) + "</option>"); }</script> </select> <select id= "minis" > <script>for (var i=0;i<60;i++) { document.write ("<option>" + i<10? 0 "+i": i) + "</option>"); }</script> </select> <input type= "button" onclick= "Inputtime ();" value= "Confirm" > </div> <div id= "div_animate" style= "width:100px;height:100px ; background-color:red; " > </div> </body> </html>