[散分]完整点击区域滑动门菜单

飘零雾雨 2007-03-29 09:55:24

今天闲来无事，把以前的一些乱七八糟的东西整理了一下，有些可能有点用处，贴出来大家看看，借此机会散点分，好久没散分了（只接分，貌似不厚道^_^）

最近，网上已有越来越多的滑动门菜单样式。可谓五花八门，让人眼花缭乱。今日闲来无事，也写了一个，仅供参考。

［演示地址：http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/menu.htm］

CSS部分：

#dymenu {
width: 100%;
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/menubg.gif) left top repeat-x;
font-size: 12px;
float: left;
}
#dymenu ul {
margin: 0;
padding: 5px 5px 0 5px;
list-style: none;
float: left;
}
#dymenu ul li {
text-align :center;
float: left;
}
#dymenu ul li a {
padding-left: 4px;
line-height: 27px;
color: #565656;
text-decoration:none;
float: left;
}
#dymenu ul li a span {
padding: 0 10px 0 6px;
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/up.gif) right center no-repeat;
float: left;
}
#dymenu ul li a:hover {
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/down_left.gif) left top no-repeat;
float: left;
}
#dymenu ul li a:hover span {
cursor: pointer;
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/down_right.gif) right top no-repeat;
float: left;
}
#dymenu ul li a.index {
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/down_left.gif) left top no-repeat;
float: left;
}
#dymenu ul li a.index span {
font-weight: bold;
background: url(http://pysj.v-ec.com/model/xhtmlcss/menu/Menu2/skin/down_right.gif) right top no-repeat;
float: left;
}

HTML部分：

<!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="text/html; charset=gb2312" />
<meta http-equiv="keyword" content="飘雨设计|DESIGN|飘雨设计社区" />
<meta http-equiv="author" content="dy615|edzmaster@gmail.com" />
<title>..:Menu Style:..</title>
</head>
<body>
<div id="dymenu">
<ul>
<li><a href="#" class="index"><span>Home</span></a></li>
<li><a href="#"><span>News</span></a></li>
<li><a href="#"><span>Products</span></a></li>
<li><a href="#"><span>About</span></a></li>
<li><a href="#"><span>Contact</span></a></li>
</ul>
</div>
</body>
</html>

...全文

625 37 打赏收藏转发到动态举报

写回复

37 条回复

切换为时间正序

请发表友善的回复…

发表回复

qzjackie 2007-04-02

打赏
举报

回复

接分咯。

mh_rock 2007-04-02

打赏
举报

回复

收藏

Dreamia 2007-04-02

打赏
举报

回复

之前网上找的版本，点击区域无法做到100%。这个版本我试试，多谢了！

cymple 2007-04-02

打赏
举报

回复

接分

webmm 2007-04-02

打赏
举报

回复

泪流满面的接分~~~~

beconcon 2007-04-02

打赏
举报

回复

接·············分

evonne0102 2007-04-02

打赏
举报

回复

收藏
JF

fredyj 2007-04-02

打赏
举报

回复

太有才了多谢啊
正需要这样的英雄呢十分感谢

mingxuan3000 2007-04-01

打赏
举报

回复

jf

adverse 2007-04-01

打赏
举报

回复

接分,帮顶

shortway 2007-04-01

打赏
举报

回复

楼主是好人.又布道,又散分!

说明了一个大道理:知识就是金钱.

夜的眼2021 2007-03-31

打赏
举报

回复

up

leohuang 2007-03-31

打赏
举报

回复

顶一下

adverse 2007-03-31

打赏
举报

回复

up

lizhizhe2000 2007-03-31

打赏
举报

回复

jf!

古月一刀2005 2007-03-31

打赏
举报

回复

QQ：410700481，这是我的QQ！

古月一刀2005 2007-03-31

打赏
举报

回复

兄弟你要是加我了，或者告诉你的QQ ，小弟将感激不尽！

古月一刀2005 2007-03-31

打赏
举报

回复

感谢楼主的分享!真是由衷的感谢，你要知道，这样的代码我找了好长时间，今天一上网就看到你的帖子，我感动的老泪纵横！

老泪纵横啊！好人啊！！

chenguang79 2007-03-29

打赏
举报

回复

感谢楼主的分享

hero4u 2007-03-29

打赏
举报

回复

不错不错，呵呵，加上数据切换就好了

加载更多回复（17）

几点声明： 1、本文的内容全部来源于七月在线发布的BAT机器学习面试1000题系列； 2、文章中带斜体的文字代表是本人自己增加的内容，如有错误还请批评指正； 3、原文中有部分链接已经失效...点击对应的问题即可跳转。

1.请简要介绍下SVM。 SVM，全称是support vector machine，中文名叫支持向量机。SVM是一个面向数据的分类算法...当训练数据线性可分时，通过硬间隔最大化，学习一个线性的分类器，即线性可分支持向量机，又称为硬间...

RNN梯度不稳定，于是加几个通路和门控，于是有了LSTM。 LSTM简化一下，有了GRU。 GAN的JS散度有问题，会导致梯度消失或无效，于是有了WGAN。 WGAN对梯度的clip有问题，于是有了WGAN-GP。 175、说说spark的性能调优。...

本系列会尽量让考察同一个部分（比如同是模型/算法相关的）、同一个方向（比如同是属于最优化的算法）的题整理到一块，为的是让大家做到举一反三、构建完整知识体系，在准备笔试面试的过程中，通过懂一题懂一片。...

BAT机器学习面试系列 1.请简要介绍下SVM。 SVM，全称是support vector machine，中文名叫支持向量机。SVM是一个面向数据的分类...当训练数据线性可分时，通过硬间隔最大化，学习一个线性的分类器，即线性可分支持...

61,115

社区成员

60,728

社区内容

发帖

与我相关

我的任务

社区管理员

加入社区

近7日
近30日
至今

加载中

查看更多榜单

社区公告

暂无公告

试试用AI创作助手写篇文章吧

+ 用AI写文章