1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
2 <html xmlns="http://www.w3.org/1999/xhtml"><head>
3 <meta http-equiv="Content-Type" content="text/html; charset=gbk">
4 <title>百度输入法</title>
5 <style type="text/css">
6 body,ul,li,button{margin:0;padding:0;}
7 body{font:12px/1.5 Tahoma;}
8 ul{list-style-type:none;}
9 button{cursor:pointer;}
10
11 #outer{width:70px;margin:10px auto;}
12 #ime{margin-top:5px;background:#fff;border:1px solid #9a99ff;display:none;}
13 #ime li{width:100%;line-height:24px;display:inline-block;vertical-align:top;}
14 #close{border-top:1px solid #9a99ff;}
15 #ime li a{color:#00c;padding:0 5px;display:block;text-decoration:none;}
16 #ime li a:hover{background:#d9e1f6;}
17 </style>
18 </head>
19 <body>
20 <div id="outer">
21 <button>输入法</button>
22 <ul style="display:none;" id="ime">
23 <li><a href="javascript:;">手写</a></li>
24 <li><a href="javascript:;">拼音</a></li>
25 <li id="close"><a href="javascript:;">关闭</a></li>
26 </ul>
27 </div>
28 <script type="text/javascript">
29 window.onload = function(){
30 var button = document.getElementsByTagName("button")[0];
31 var ime = document.getElementById("ime");
32 var oclose = document.getElementById("close");
33 button.onclick = function(){
34 //这个表达式请注意看..
35 //
36 ime.style.display = ime.style.display == "block" ? "none" : "block";
37 };
38 oclose.onclick = function(){
39 ime.style.display = "none";
40 }
41
42
43
44
45 }
46 </script>
47 </body>
48 </html>
