<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>仿淘宝的产品分类菜单</title> <style> body {text-align:center;font-family:"宋体"; margin:0; padding:0;font-size:12px; color:#000;overflow-x:hidden} div,form,img,ul,ol,li,dl,dt,dd {margin:0;padding:0;border:0;text-align:left;} .Nav{border-top:2px solid #c00} .Nav .Navlf{width:358px;float:left;display:inline;margin:0px;padding:0px;border:1px solid #d8d8d8;border-top:none;border-left:none;position:relative;} .Navlf .Navleft{width:350px;float:left;display:inline;height:450px;margin:0px;margin-left:2px;padding:0px;} .Navleft a:visited{color:#333} .Nav_head1{margin:0px;position:relative;z-index:99;float:left;display:inline;} .Nav_head1 li{padding:0px;position:relative;float:left; display:inline-block;height:auto;line-height:22px;} .Nav_head1 a{padding:0 10px 0 0;display:block;color:#333} .Nav_head1 a:hover{text-decoration:none;background:#fff} .Nav_head1 :hover > a{color:#f60;text-decoration:none;background:#fff} .Nav_head1 ul{border:2px solid #fff;border-top:0px;position:absolute;font:normal 12px/22px arial;display:inline;padding:0 0px 6px 0px;overflow:hidden;left:0; height:120px;width:273px;word-wrap:break-word;word-break:break-all;} .Nav_head1 ul li{padding:1px 0px 0px 0px;line-height:23px;margin-left:10px;margin-right:-2px;left:left;white-space:nowrap} .Nav_head1 ul li h3{ font-size:14px; font-weight:bold; margin:0; padding:0;} .Nav_head1 table {position:absolute;top:0;left:0;} .Nav_head1 ul a, .Nav_head1 ul a:visited {color:#333;padding:0 1px 0 2px;background:none;} .Nav_head1 ul a:hover{color:#fff;background:#30528F;text-decoration:none;} .Nav_head1 ul :hover > a {color:#fff;background:#30528F} .Nav_head1 li:hover ul,.Nav_head1 a:hover ul{margin:-2px;display:inline;visibility:visible;height:auto;border:2px #c00 solid;padding:2px; background:#ffe} </style> </head> <body> <div class="Nav"> <div class="Navlf"> <div class="Navleft"> <div style="width:300px;float:left; position:relative;left:0px;right:0px; z-index:0;height:306px;display: inline-block;"> <ul id="menu" class="Nav_head1" style="z-index:9999;"> <li style="z-index:9998" id="cid_284"><a href="#"><!--[if IE 7]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]--> <ul style="top:0px;"> <li><h3><a href="#">ASP源码</a></h3></li><li><a href="#">社区论坛</a></li><li><a href="#">新闻文章</a></li><li><a href="#">博客日记</a></li><li><a href="#">留言聊天</a></li><li><a href="#">小偷采集</a></li><li><a href="#">主机域名</a></li><li><a href="#">企业网站</a></li><li><a href="#">CMS整站</a></li><li><a href="#">音乐视频</a></li><li><a href="#">其它分类</a></li></ul><!--[if lte IE 6]></td></tr></table></a><![endif]--> </li><li style="z-index:9997" id="cid_636"><a href="#"><!--[if IE 7]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]--> <ul style="top:100px;"> <li><h3><a href="#">PHP源码</a></h3></li><li><a href="#">Ajax相关</a></li><li><a href="#">数据管理</a></li><li><a href="#">博客日记</a></li><li><a href="#">留言聊天</a></li><li><a href="#">新闻文章</a></li><li><a href="#">插件模块</a></li><li><a href="#">企业网站</a></li><li><a href="#">CMS系统</a></li><li><a href="#">音乐视频</a></li><li><a href="#">其它分类</a></li></ul><!--[if lte IE 6]></td></tr></table></a><![endif]--> </li><li style="z-index:9996" id="cid_291"><a href="#"><!--[if IE 7]><!--></a><!--<![endif]--><!--[if lte IE 6]><table><tr><td><![endif]--> <ul style="top:200px;"> <li><h3><a href="#">DELPHI源码</a></h3></li><li><a href="#">窗体设计</a></li><li><a href="#">系统相关</a></li><li><a href="#">算法相关</a></li><li><a href="#">解压压缩</a></li><li><a href="#">数据库相关</a></li><li><a href="#">文本处理</a></li><li><a href="#">图形处理</a></li><li><a href="#">其它分类</a></li></ul><!--[if lte IE 6]></td></tr></table></a><![endif]--> </li><li style="z-index:9995" id="cid_509"><a href="#"></a></li></ul> </div> </div> </div> </div> </body> </html>
相关推荐
高仿淘宝首页菜单滑动效果,不分页。 重要逻辑:通过菜单的偏移量计算PageControl的偏移量 pageControl的偏移量为pageControl的总宽度减去滑块的总宽度, 同理scrollView的偏移量为scrollView的内容宽度减去...
这次我们要来分享一款相对实用的jQuery插件,它是一款用jQuery和CSS实现的仿淘宝左侧商品分类菜单。鼠标滑过主菜单即可展开商品二级菜单,菜单上也同时有漂亮的商品小图标。菜单由jQuery打造,所以兼容性都还可以。
仿淘宝taobao商城类别菜单效果 在网上找了很久的,并且在网站已应用,如有问题站内留言!
自己在开发时用到的,现在拿出来给正在寻找仿淘宝菜单效果的朋友们,希望对你们有参考作用!
本文实例讲述了div+css实现仿淘宝的产品分类菜单效果代码。分享给大家供大家参考。具体如下: 这是一款仿淘宝的产品分类菜单,CSS菜单,鼠标移上去,显示隐藏部分内容,仿写的淘宝网菜单,CSS和JS实现,用于产品分类...
仿淘宝网多级分类列表菜单代码,可支持三级以上
仿淘宝网左侧的商品分类菜单的js和html代码。
淘宝左边分类菜单效果仿淘宝网左侧的商品分类菜单代码效果是完好的。。 如有出错请联系 940063189
jQuery仿淘宝商品发布选择分类代码是一款类似淘宝网宝贝发布选择分类导航菜单特效。
jQuery仿淘宝红色分类导航是一款左侧多级弹出分类导航菜单特效代码。
jQuery实现的仿淘宝左侧商品分类菜单效果源码.zip
多级分类菜单 多级列表 仿口碑分类菜单 电商筛选菜单
Jquery实现仿淘宝天猫左侧分类导航插件,供大家一起共同分享学习。
jquery淘宝电器左侧分类菜单是一款基于jquery实现的仿淘宝电器城左侧自适应屏幕高度下拉导航菜单代码。
仿照淘宝实现了,多级菜单显示的功能,主要是定位和动态计算。
jQuery仿淘宝商品发布选择分类代码是一款类似淘宝网宝贝发布选择分类导航菜单特效。
本文实例讲述了原生JS实现仿淘宝网左侧商品分类菜单效果代码。分享给大家供大家参考。具体如下: 这是一款原生JS实现的仿淘宝网左侧商品分类菜单效果代码,JavaScript技术实现,兼容各主流浏览器。自己再修改一下CSS...
一、封装分类菜单,已经支持pod下载 ,请更新pod版本库OC版本:pod搜索:pod search CGXVerticalMenuView-OC如果搜不到去请搜索:pod search CGXVerticalMenuView-OC --simplegit链接:...!!