js仿淘宝的拼音检索特效代码_导航菜单

来源：动视网责编：小采时间：2020-11-27 20:39:50

js仿淘宝的拼音检索特效代码_导航菜单

js仿淘宝的拼音检索特效代码_导航菜单:以下是HTML网页特效代码，点击运行按钮可查看效果 js仿taobao效果 *{ margin:0;padding:0;} body{ font:normal 12px Verdana, Arial, Helvetica, sans-serif; text- align:center;} #warpper{ position

推荐度：

点击下载本文 文档为doc格式

导读js仿淘宝的拼音检索特效代码_导航菜单:以下是HTML网页特效代码，点击运行按钮可查看效果 js仿taobao效果 *{ margin:0;padding:0;} body{ font:normal 12px Verdana, Arial, Helvetica, sans-serif; text- align:center;} #warpper{ position

以下是HTML网页特效代码，点击运行按钮可查看效果

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>js仿taobao效果</title> 
<style type="text/css"> 
 *{ margin:0;padding:0;} 
 body{ font:normal 12px Verdana, Arial, Helvetica, sans-serif; text- 
align:center;} 
 #warpper{ position:absolute; left:100px; top:100px;} 
 h5{ float:left;} 
 a{ text-decoration:underline; cursor:pointer; font-weight:bold;} 
 dl{ height:18px; line-height:18px; background:#f7f7f7; padding:0 10px;} 
 dt,.normal{ float:left; padding:0 10px; border-right:1px solid #ccc; text- 
decoration:none; width:auto; cursor:pointer;} 
 dt.over{ position:relative;border:1px solid #86e5f0; padding:0 10px 15px 
10px; border-bottom:1px solid #caf1f1; margin:-1px 0 0 -1px; z-index:1000; 
color:#ff6026; text-decoration:underline; background:#caf1f1; height:22px; } 
 li{ float:left; list-style-type:none; margin:5px 10px; width:120px;} 
 dl dd{ position:absolute; width:500px; left:0;top:37px!important; border:1px 
solid #86e5f0; background:#caf1f1; 
filter:progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=120, 
color=#cccccc); padding:10px 0;} 
 .block{ display:block;} 
 .none{ display:none;} 
</style> 
 
 function $(str){ return document.getElementById(str);} 
 function $$(str){ return document.getElementsByTagName(str);} 
 function changeMenu(thisObj,num){ 
 if(thisObj.className=="over") return false; 
 var tabObj=thisObj.parentNode.getAttribute("id"); 
 var obj_dt=$("warpper").getElementsByTagName("dt"); 
 for(var i=0;i<obj_dt.length;i++){ 
 if(i==num){ 
 thisObj.className="over"; 
 $("c"+(i+1)).className="block"; 
 } 
 else{ 
 obj_dt[i].className="normal"; 
 $("c"+(i+1)).className="none"; 
 } 
 } 
 } 
</ script> 
</head> 
<body> 
 
 <h5>拼音检索：</h5> 
 
 a 
 
 
 <li>Adidas</li> 
 <li>AEE/爱意</li> 
 <li>AF</li> 
 <li>AF棒球帽</li> 
 <li>Agatha</li> 
 <li>Albion/奥尔滨</li> 
 <li>AMD</li> 
 <li>Andox</li> 
 <li>Artini</li> 
 <li>爱普生</li> 
 
 
 
 b 
 
 
 <li>fasfs</li> 
 <li>fsdfsd</li> 
 
 
 
 c[ch] 
 
 
 <li>fasfs</li> 
 <li>fsdfsd</li> 
 <li>fdsfas</li> 
 
 
 
 d 
 
 
 <li>fasfs</li> 
 <li>fsdfsd</li> 
 <li>fdsfas</li> 
 <li>fasdffsd</li> 
 
 
 
 e 
 
 
 <li>fasfs</li> 
 <li>fsdfsd</li> 
 <li>fdsfas</li> 
 <li>fasdffsd</li> 
 <li>fasdfsaf</li> 
 
 
 
 f 
 
 
 <li>脚本之家</li> 
 <li>jb51.net</li> 
 <li>脚本</li> 
 <li>alixixi</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 <li>Fancl</li> 
 
 
 
</body> 
</html>

[Ctrl+A 全选注:如需引入外部Js需刷新才能执行]

js仿淘宝的拼音检索特效代码_导航菜单

推荐度：

点击下载本文 文档为doc格式

标签：代码特效代码 js仿淘宝

热门焦点

js仿淘宝的拼音检索特效代码_导航菜单

js仿淘宝的拼音检索特效代码_导航菜单

js仿淘宝的拼音检索特效代码_导航菜单

最新推荐

猜你喜欢

热门推荐