05 2011 档案
摘要：代码简介：js实现无限级树形下拉导航菜单，简洁实用，用到一个已封装好的JS类，有用的大家借鉴一下。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>js实现无限级树形导航列表_网页代码站(www.webdm.cn)</title></head><body><style type="text/css"> *{ margin:0; padding:0; list-style:none;} body {
阅读全文
摘要：代码简介：【荐】DIV+CSS仿360buy京东商城导航条 ，很棒的，赶快来试试。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>【荐】DIV+CSS仿360buy京东商城导航条_网页代码站(www.webdm.cn)</title><style type="text/css">.my_left_category{ width:150px; font-size:12px; font-family:arial,sans-s
阅读全文
摘要：代码简介：这是自己写的一个右键菜单类，屏蔽掉了IE固有的右键菜单，一共有四个参数：第一个是出发显示右键菜单的div的id 第二个是右键菜单这个层的id，根据这个id去创建一个新的层，menuList是菜单项的列表，对应了点击一个菜单项后触发的函数，classList是菜单的class名称，以及菜单项对应的class名称，包含了鼠标滑过时的class。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>Javascript右键菜单类_网页代码站(www.webdm.cn
阅读全文
摘要：代码简介：左侧竖向滑动菜单，基于JavaScript+CSS，没有过多的修饰，主要想实现菜单的动画效果，想用的朋友，自己美化吧。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>左侧竖向滑动菜单_网页代码站(www.webdm.cn)</title><style type="text/css">body{ margin:10px; padding:10px;}a:link { text-decoration: none;c
阅读全文
摘要：代码简介：级横向滑动，二级竖向下拉综合菜单，这个菜单一共是三级，前两级是滑动切换的方式，第三级主要是下拉菜单的形式，虽然简单的样式简约，但是实现他们其实是很复杂的，希望从事前端开发的朋友一同参考一下吧。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>【荐】JS一级横向滑动，二级竖向下拉的综合菜单_网页代码站(www.webdm.cn)</title><style type="text/css"> <!--body,
阅读全文
摘要：代码简介：纯CSS代码实现比较经典的蓝色风格下拉菜单，最多支持两级，适用于各种企业网站，新闻资讯类网站，效果挺棒的，不是吗？虽然没有用到过多的修饰，但给你的感觉清新、大方、简洁，符合现代网站的特点。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>很漂亮的蓝色CSS下拉菜单_网页代码站(www.webdm.cn)</title><style>*{margin:0;padding:0;border:0;}#div_center { width:
阅读全文
摘要：代码简介：纯CSS下拉菜单，绝对没有用Javascript，虽然简单，但是美观大方，先运行一下看看效果吧，本菜单扩展性很好，你完全可以在此基础上继续完善功能，以满足您的使用要求。代码内容：<!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">
阅读全文
摘要：代码简介：使用jquery1.3.2制作的竖向伸缩菜单，每点击一次主菜单，会拉开出对应的二级菜单，再次点击会合拢，欢迎下载使用。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>jQuery1.3.2竖向的伸缩菜单_网页代码站(www.webdm.cn)</title><script type="text/javascript" src="http://www.webdm.cn/themes/script/jquery
阅读全文
摘要：代码简介：我觉得这个菜单非常漂亮，暖色调，而且 是用纯CSS技术实现，每个菜单项会自动适应其宽度，达到完美无暇，兼容性也很好，至于字体颜色以及链接的颜色等，这些你都可以再加工，不多说了，想看效果的先运行一下吧。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>纯CSS写的超漂亮自适应的导航菜单_网页代码站(www.webdm.cn)</title><style>#top { display: block; text-align: left;
阅读全文
摘要：代码简介：一个基于JavaScript的层手动实例，让网站的菜单可以拖拽移位，记得土豆网的“豆单”有这种功能。本效果还尚未彻底完成，部分地方因没有写入对应内容，因此JS可能会提示有错误。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>Js打造层拖动实例：网站菜单拖拽移位效果_网页代码站(www.webdm.cn)</title><style type="text/css">*{ margin:0; padding:0}
阅读全文
摘要：代码简介：这个导航条做的不错，是模仿迅雷视频网站的，完全基于CSS和HTML代码，大气清新，请运行一下看看效果如何。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>摘自迅雷视频网站基于CSS+HTML实现大气清新的蓝色导航_网页代码站(www.webdm.cn)</title><style type="text/css">body{margin:0px;font-size:13px; font-family:Verda
阅读全文
摘要：代码简介：一个纵向布局的CSS+JavaScript滑动门代码，相当简洁的手法来实现，如果对颜色不满意，你可以试着自己修改CSS代码，这个滑动门将每一个“门”的内容存入JS数组中，这样可以减少代码量，但也带来了一个扩展的问题，扩展性方面有待完善，仅供参考。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>一个纵向布局的CSS+JavaScript滑动门代码_网页代码站(www.webdm.cn)</title><style>td,a,bod
阅读全文
摘要：代码简介：CSS版相当漂亮的滑动门式导航菜单，蓝色系，立体效果，设计的非常精美，希望大家能够喜欢哦。主菜单分为二级，如果想多级，可以看看代码是如何调用的，分级后菜单结构更加明淅，用户体验更好。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>漂亮的CSS蓝色滑动门式的导航菜单_网页代码站(www.webdm.cn)</title><style>#top { display: block; text-align: left; height:1
阅读全文
摘要：代码简介：鼠标悬停时动态翻滚的导航条，注意这里用了两个背景图，请等待网页加载完成或多刷新几次，这个是使用JavaScript实现的，不过代码好像是从jQuery里摘出来的，有点像。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>JS鼠标悬停时动态翻滚的紫色导航条_网页代码站(www.webdm.cn)</title><style type="text/css">.clear:after{content:".&
阅读全文
摘要：代码简介：CSS伪类实现的鼠标滑动链接，是一个图片导航，在早期的DW中有专一制作本效果的插件，不过随着大家CSS水平的提高，现在做出这种效果好像得心应手了，因为这种果大家应该都挺喜欢的。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>CSS伪类实现的鼠标滑动图片链接_网页代码站(www.webdm.cn)</title><style>body {text-align:center;font-size:12px;color:#777777;f
阅读全文
摘要：代码简介：CSS+JavaScript经典版折叠、合拢的多级菜单，这个菜单还是值得研究一下的，一共可展开三层，最里面一级用滚动条来显示菜单内容，整个菜单竖直风格，放到网页的左侧或当作后台管理菜单的模块貌似还不错。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>JavaScript+CSS折叠、合拢的多级菜单_网页代码站(www.webdm.cn)</title><style>*,body,ul,li,h1,h2{ margin:0; pad
阅读全文
摘要：代码简介：防win桌面右键灰色菜单，很神似。代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>JS防win桌面右键灰色菜单_网页代码站(www.webdm.cn)</title></head><BODY oncontextmenu=window.event.returnValue=false bgcolor="#ffffff"> <style type="text/css"> &
阅读全文
摘要：代码简介：鼠标划过快速展开的JS下拉菜单，缺点是代码偏多，建议封装在一个文件里。代码内容:<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>鼠标划过快速展开的JS下拉菜单_网页代码站(www.webdm.cn)</title></head><body> <SCRIPT language=jscript>var mmenus = new Array();var misShow = new Boolean(); misShow=fa
阅读全文
摘要：代码简介：【荐】QQ菜单生成器。很不错的代码，需要什么项目直接添加了生成，还带了预览功能！代码内容：<html xmlns="http://www.w3.org/1999/xhtml"><head> <title>【荐】QQ菜单生成器_网页代码站(www.webdm.cn)</title><script language="javascript">//生成代码function createCode(){ totalheight = parseInt(fcreate.bodyheight.valu
阅读全文
摘要：代码简介：常用于后台的JS多级树形目录，代码虽然老，但很实用。代码内容：<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"><HTML><HEAD><TITLE>常用于后台的JS多级树形目录_网页代码站(www.webdm.cn)</TITLE><META http-equiv=Content-Type content="text/html; charset=gb2312"><style>td{tex
阅读全文
摘要：代码简介：绿色简单的CSS下拉菜单，拿过去打造成自己的下拉菜单，很不错的。代码内容：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<a href="http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" target="_blank">http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</a>&qu
阅读全文
摘要：代码简介：很不错的效果，类似动画慢慢的折叠。代码内容：<!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=&q
阅读全文
摘要：代码简介：纯CSS打造横向橘黄菜单导航，也漂亮的，运行一下，您就知道！代码内容：<!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&quo
阅读全文
摘要：代码简介：防Yahoo的选项卡导航特效，代码有些多，建议封装单独一个JS文件调用。代码内容：<!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-Ty
阅读全文
摘要：代码简介：Div+CSS+JS实现的树型下拉菜单导航。刷新页面，导航不变。代码内容：<!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&q
阅读全文
摘要：代码简介：CSS打造很漂亮的橘黄垂直导航，简约又好看，直接拿过去用吧。代码内容：<html><head> <title>CSS打造很漂亮的橘黄垂直导航_网页代码站(www.webdm.cn)</title><style type="text/css">#vertmenu {font-family: Verdana, Arial, Helvetica, sans-serif;font-size: 100%;width: 160px;padding: 0px;margin: 0px;}#vertmenu h1 {dis
阅读全文
摘要：代码简介：纯CSS制作简洁带提示的导航，很实用，代码也比价少。代码内容：<!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><title>纯CSS制作简洁带提示的导航_网页代码站(www.webdm.cn
阅读全文
摘要：代码简介：【荐】JavaScript制作可伸缩的淡绿色菜单导航，运行一下，您就知道！代码内容：<!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-T
阅读全文
摘要：代码简介：JS+Table实现可折叠的商品分类导航，很实用的代码，尤其用在电子商务站。代码内容：<html><head><meta http-equiv="Content-Type" content="text/html; charset=gb2312" /><title>JS+Table实现可折叠的商品分类导航_网页代码站(www.webdm.cn)</title></head><style type="text/css">td {font-size
阅读全文
摘要：代码简介：全国的省市县联动代码，不用多介绍，很实用，用途广。代码内容：<html><head> <title>全国的省市县联动代码_网页代码站(www.webdm.cn)</title> <script type="text/javascript"> function Dsy(){ this.Items = {};}Dsy.prototype.add = function(id,iArray){ this.Items[id] = iArray;}Dsy.prototype.Exists = function(id)
阅读全文
摘要：代码简介：JS+CSS实现的非常漂亮的橘黄色滑动门，记得有个CSS文件，很棒的。代码内容：<!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" lang="zh-CN"><head><title>J
阅读全文
摘要：代码简介：JS+Div实现的阴影菜单，放出来的让大家学习JS，CSS的朋友参考。代码内容：<title>JS+Div实现的阴影菜单_网页代码站(www.webdm.cn)</title><script>var global = window.documentglobal.fo_shadows = new Arrayfunction makeRectangularDropShadow(el, color, size){ var i; for (i=size; i>0; i--) { var rect = document.createElement(&#
阅读全文
摘要：代码简介：jquery配合css来实现的导航，有助您对jquery的学习，很酷的，运行一下，您就知道。代码内容：<!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="
阅读全文
摘要：代码简介：本例程实现了自动能够隐藏菜单的效果，菜单效果变化的实现方法，对不同浏览器的支持，对鼠标移动的函数响应，统一格式的生成方法。代码内容:<html><head> <title>JS自动隐藏的菜单_网页代码站(www.webdm.cn)</title><SCRIPT language=JavaScript>function move(x, y) {<!--对象移动x，y-->if (document.all) {<!--对于ie浏览器-->object1.style.pixelLeft += x;<!
阅读全文
摘要：代码简介：JS超级酷的导航菜单代码，类似WINDOWS风格的导航，又又立体效果，很不错的，赶快运行一下，一睹为快吧。代码内容：<HTML><HEAD><TITLE>JS超级酷的导航菜单代码_网页代码站(www.webdm.cn)</TITLE><META content="text/html; charset=gb2312" http-equiv=Content-Type><SCRIPT type=text/javascript>var dragobject = null;var tx;var ty;f
阅读全文
摘要：代码简介：鼠标悬停时动态翻滚的导航条，这个是使用JavaScript实现的，不过代码好像是从jQuery里摘出来的，有点像。代码内容：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html><head><meta http-equiv="Content-Type" content="tex
阅读全文
摘要：代码简介：JavaScript配合CSS完成的滑动门，一大特色是线条分明，没有过多修饰背景颜色，更能看清楚滑动门的结构。代码内容：<!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 runat="server&
阅读全文
摘要：代码简介：苹果官方网站的菜单,实际上是看着好看,但看了代码感觉不太实用,因为为了实现这么一个效果代码太繁琐,而且菜单修改起来也极不方便,建议大家以学习的态度阅读源码。代码内容：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"
阅读全文
摘要：代码简介：JavaScript防FLASH效果的下拉菜单导航，单击文本链接，在下方出现相应的导航内容，很不错的。代码内容：<html><head><title>JavaScript防FLASH效果的下拉菜单导航代码_网页代码站(www.webdm.cn)</title><style><!--#iewrap{position:relative;height:30px}#iewrap2{position:absolute}#dropmenu03{filter:revealTrans(Duration=1.5,Transition=1
阅读全文
摘要：代码简介：纯Css打造的下拉菜单，兼容性极好，只不过没怎么美化，您只需稍做美化。一款强大的下拉菜单就做好了。代码内容：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta name="robots" co
阅读全文
摘要：代码简介：老外做的，代码简洁，兼容性好，大气十足，也许您正需要。代码内容：<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"><head><meta http
阅读全文
摘要：代码简介：老外弄的，并且还带了圆角，很流畅，当鼠标经过触发内容切换，很不错的，您试试。代码内容：<!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-
阅读全文