码迷,mamicode.com
首页 > 其他好文 > 详细

搜索引擎点击隐藏文字

时间:2017-07-02 22:20:49      阅读:220      评论:0      收藏:0      [点我收藏+]

标签:function   ges   cti   sea   search   nbsp   ...   idt   技术分享   

技术分享

 1 <!DOCTYPE html>
 2 <html>
 3 <head lang="en">
 4     <meta charset="UTF-8">
 5     <title></title>
 6 </head>
 7     <style>
 8         input,
 9         button {
10             padding: 0;
11             border: 0 none;
12             outline-style: none;
13         }
14         .search {
15             width: 258px;
16             height: 40px;
17             background-color: gray;
18             margin: 100px auto;
19             
20         }
21         .search #txt {
22             float: left;
23             width: 208px;
24             height: 40px;
25             background: url(images/left.jpg) no-repeat;
26             padding-left: 8px;
27             color: #ccc;
28         }
29         .search button {
30             float: left;
31             width: 42px;
32             height: 40px;
33             background: url(images/right.jpg) no-repeat;
34         }
35 
36     </style>
37 
38     <script>
39         window.onload = function () {
40             function $(id){
41                 return document.getElementById(id);
42             }
43 //            获取焦点
44             $("txt").onfocus = function () {
45                 if($("txt").value == "请输入..."){
46                     $("txt").value = "";
47                     $("txt").style.color = "#333";
48                 }
49             }
50             $("txt").onblur = function () {
51                 if($("txt").value == ""){
52                     $("txt").value = "请输入...";
53                     $("txt").style.color = "#ccc";
54                 }
55             }
56 
57 
58         }
59     </script>
60 <body>
61     <div class="search">
62         <input type="text" id="txt" value="请输入..."/>
63         <button></button>
64     </div>
65 </body>
66 </html>

 

搜索引擎点击隐藏文字

标签:function   ges   cti   sea   search   nbsp   ...   idt   技术分享   

原文地址:http://www.cnblogs.com/luxiaoyao/p/7107132.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!