360搜索框代码可切换百度.谷歌.必应免费搜索框
操作方法
- 01
- 02
<html><head><meta http-equiv="content-type" content="text/html; charset=utf-8"><style>#search ul {list-style-type: none;display: block;width: 100px;height: 33px;margin: 0;padding: 0;border: 0px;float: left;}#search li {border: 0px;margin: 0px;padding: 0px;}#search .selected {display: block;}#search form {margin: 0px;padding: 0px;}#search input {height: 30px;width: 400px;margin: 0px;}#search .button {font-size: 17px;font-weight: 600;color: #002D96;height: 30px;width: 110px;margin-left: 50px;background: #e6efc2;opacity: 0.8;border: #7fb80e 1px solid;cursor: pointer;-webkit-border-radius: 2px;border-radius: 2px;}</style></head><body><div id="search" align="center"><table><tr><td><ul><li style="display:block;"><img src="/jscss/demoimg/201208/baidu.jpg"/></li><li style="display:none;"><img src="/jscss/demoimg/201208/baidu.jpg"/></li><li style="display:none;"><img src="/jscss/demoimg/201208/gg.jpg"/></li><li style="display:none;"><img src="/jscss/demoimg/201208/sougou.jpg"/></li></ul></td><td style="padding-left:10px;"><form style="display:block" action="http://www.baidu.com/baidu" method="get"><input name=tn type="hidden" value="baidu"/><input type="text" name="word"/><input class="button" type="submit" value="百度一下" onMouseOver="this.style.opacity='1'" onMouseOut="this.style.opacity='0.7'"/></form><form style="display:none" action="http://www.google.com/search" method="get"><input type="text" name="q"/><input class="button" type="submit" value="google搜索" onMouseOver="this.style.opacity='1'" onMouseOut="this.style.opacity='0.7'"/></form><form style="display:none" action="http://www.sogou.com/web" target="_blank" name="sogou_queryform"><input type="text" name="query"><input class="button" type="submit" value="sougou搜索" onMouseOver="this.style.opacity='1'" onMouseOut="this.style.opacity='0.7'"/></form></td></tr></table></div><script> var search = document.getElementById("search"); var forms = document.getElementsByTagName("form"); var ul = search.getElementsByTagName("ul")[0]; var li = ul.getElementsByTagName("li"); var length = li.length; li[0].onclick = function() { for (var i = 1; i < length; i++) { li[i].style.display = "block"; } } var n = 0; for (var i = 1; i < length; i++) { li[i].onclick = function(a) { return function() { li[0].innerHTML = this.innerHTML; for (var j = 1; j < length; j++) { li[j].style.display = "none"; } forms[n].style.display = "none"; forms[a].style.display = "block"; n = a; } }(i - 1); li[i].onmouseover = function(){ //this.style.border = "#7fb80e 1px solid"; this.style.background = "#f2eada"; } li[i].onmouseout = function(){ this.style.border = "0px"; this.style.background = "inherit"; } }</script></body></html> 全网搜索 <style type="text/css"> #so360{white-space:nowrap} #so360 form{margin:0;padding:0} #so360_keyword{width:307px;height:24px;line-height:24px;font:14px arial;padding:2px 5px;margin-right:5px; border:2px solid #3EAF0E;outline:0;vertical-align:middle;} #so360_keyword{background:url(http://p3.qhimg.com/d/inn/d84bf96d/bg.png) no-repeat right center;} #so360_submit{width:70px;height:32px;line-height:32px;border:0;color:#fff;background:#3FB30E; font-weight:bold;font:bold 14px arial;padding:0;padding-top:3px\9;cursor:pointer; vertical-align:middle} </style> <div id="so360"> <form action="http://www.so.com/s" target="_blank" id="so360form"> <input type="text" autocomplete="off" name="q" id="so360_keyword"> <input type="submit" id="so360_submit" value="搜 索"> <input type="hidden" name="ie" value="utf-8"> <input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"> </form> </div> <script type="text/javascript"> (function() { function $(id) { return document.getElementById(id); } function addEvent(node , type , fn) { if(node.addEventListener) { node.addEventListener(type , fn , false); } else if(node.attachEvent){ node.attachEvent("on" + type , fn); } else { node["on" + type] = fn; } }; var form = $("so360form"); if(!form) { return; } addEvent(form , "submit" , function() { form.src.value = "zz_" + window.location.host.replace(/\./g , "_"); return true; }); })(); </script> <style type="text/css"> #so360{white-space:nowrap} #so360 form{margin:0;padding:0} #so360_keyword{width:487px;height:24px;line-height:24px;font:14px arial;padding:2px 5px;margin-right:5px; border:2px solid #B30E0E;outline:0;vertical-align:middle} #so360_keyword{background:url(http://p3.qhimg.com/d/inn/d84bf96d/bg.png) no-repeat right center} #so360_submit{width:90px;height:32px;border:0;color:#fff;background:#B30E0E; font-weight:bold;font:bold 14px arial;padding:0;padding-top:3px\9;cursor:pointer; vertical-align:middle} </style> <div id="so360"> <form action="http://www.so.com/s" target="_blank" id="so360form"> <input type="text" autocomplete="off" name="q" id="so360_keyword"> <input type="submit" id="so360_submit" value="搜 索"> <input type="hidden" name="ie" value="utf8"> <input type="hidden" name="src" value="zz"> <input type="hidden" name="site" value="so.com"> <input type="hidden" name="rg" value="1"> </form> </div> <script type="text/javascript"> (function() { function $(id) { return document.getElementById(id); } function addEvent(node , type , fn) { if(node.addEventListener) { node.addEventListener(type , fn , false); } else if(node.attachEvent){ node.attachEvent("on" + type , fn); } else { node["on" + type] = fn; } }; var form = $("so360form"); if(!form) { return; } addEvent(form , "submit" , function() { form.src.value = "zz_" + window.location.host.replace(/\./g , "_"); return true; }); })(); </script> 360搜索免费为站长们开放了站内搜索工具