- 论坛徽章:
- 0
|
01 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
02 <html xmlns="http://www.w3.org/1999/xhtml">
03 <head>
04 <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
05 <title>无标题文档</title>
06 <script type="text/javascript" src="jquery-1.4.2.min.js"></script>
07 <script>
08 var i=0;
09 var tdata={head:[{name:'名词'},{name:'数量'}],data:[{name:'语文',count:12},{name:'数学',count:30}]};
10 function addNewrow(){
11 $("#tt").append("<tr id='tr_"+i+"'><td>"+i+"<input name='fdsa' type='text'></td><td><button onclick='removeThis("+i+");'>删除</button></td></tr>");
12 i++;
13 }
14 function removeThis(ids){
15 $("#tr_"+ids).remove();
16 i--;
17 }
18 function reposition(){
19 $("#bottomdiv").css("margin-top",$(window).height()-$("#bottomdiv").height()-2);
20 $("#bottomdiv").css("margin-left",$(window).width()-$("#bottomdiv").width()-2);
21 $("#tt tbody").append("<tr>");
22 $.each(tdata.head,function(i,row){
23 $("#tt tbody").append("<th>"+row.name+"</th>");
24 });
25 $("#tt tbody").append("</tr>");
26 $.each(tdata.data,function(i,row){
27 $("#tt tbody").append("<tr><td>"+row.name+"</td><td>"+row.count+"</td></tr>");
28
29 });
30 }
31 $(function (){reposition();
32 $("#div_animate").animate({
33 height: 'toggle', opacity: 'toggle'
34 }, "slow");
35 $("#div_animate").animate({
36 height: 'show', opacity: 'show'
37 }, "slow");
38 });
39 var zoom=10;
40 function maxZoom(){
41 zoom+=5;
42 $("#zoomdiv").css("zoom",zoom/10);
43 }
44 function minZoom(){
45 if(zoom<=0){
46 zoom=5;
47 }else{
48 zoom-=5;
49 }
50 $("#zoomdiv").css("zoom",zoom/10);
51 }
52 var inobj=null;
53 function inputTime(){
54
55 }
56 </script>
57 <style type="text/css">
58 body{ margin:0 0 0 0;}
59 button{padding-top:3px;}
60 input {padding-top:3px;}
61 #ddiv{overflow:auto;float:left;width:800px;height:300px;}
62 </style>
63 </head>
64 <body>
65 <button onclick="addNewrow();">增加</button><button onclick="maxZoom();">放大</button><button onclick="minZoom();">缩小</button>
66 <div id="ddiv">
67 <div id="zoomdiv">
68 <table id="tt">
69 <tbody>
70 </tbody>
71 </table>
72 <input type="button" value="按钮">
73
74 </div>
75 </div>
76 <div id="timeseler">
77 <select id="hour">
78 <script>for(var i=0;i<24;i++){
79 document.write("<option>"+(i<10?("0"+i):i)+"</option>");
80 }</script>
81 </select>
82 <select id="minis">
83 <script>for(var i=0;i<60;i++){
84 document.write("<option>"+(i<10?("0"+i):i)+"</option>");
85 }</script>
86 </select>
87 <input type="button" onclick="inputTime();" value="确认">
88 </div>
89 <div id="div_animate" style="width:100px;height:100px;background-color:red;"> </div>
90 </body>
91 </html> |
|
免费注册
发表于 2010-12-28 23:11