CSS论坛 - Powered by Discuz! Board

标题: DIV+CSS下拉导航打包下载（JS动画版） [打印本页]

作者: divcss5文采 时间: 2011-4-29 17:51 标题: DIV+CSS下拉导航打包下载（JS动画版）

动画效果的DIV+CSS+JS导航-下拉菜单导航

可用于网站栏目导航-网页导航menu

CSS下拉菜单详细介绍：http://www.divcss5.com/template/m224.shtml
演示地址：http://www.divcss5.com/fanli/divcss下拉导航菜单/

DIV+CSS下拉导航菜单.rar

下载地址：
点击下载大小23.764KB

作者: java454 时间: 2011-5-4 15:53 标题: 回复 1# divcss5文采的帖子

<!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>home</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.js"></script>
<script type="text/javascript" src="js/easySlider1.5.js"></script>
<script type="text/javascript" charset="utf-8">
// <![CDATA[
$(document).ready(function(){
$("#slider").easySlider({
controlsBefore: '<p id="controls">',
controlsAfter: '</p>',
auto: true,
continuous: true
});
});
// ]]>
</script>
<style type="text/css">
#slider { margin:0; padding:0; list-style:none; }
#slider ul,
#slider li { margin:0; padding:0; list-style:none; }
/*
define width and height of list item (slide)
entire slider area will adjust according to the parameters provided here
*/
#slider li { width:906px; height:386px; overflow:hidden; }
p#controls { margin:0; position:relative; }
#prevBtn,
#nextBtn { display:block; margin:0; overflow:hidden; width:44px; height:44px; position:absolute; left:0; top:-250px; }
#nextBtn { left:862px; }
#prevBtn a { display:block; width:44px; height:44px; background:url(images/l_arrow.gif) no-repeat 0 0; }
#nextBtn a { display:block; width:44px; height:44px; background:url(images/r_arrow.gif) no-repeat 0 0; }
</style>
</head>
<body>
<div class="main">
  <div class="header">
<div class="block_header">
   <div class="logo"><a href="index.html"><img src="images/logo.gif" width="401" height="145" border="0" alt="logo" /></a></div>
   <div class="menu">
      <ul>
      <li><a href="index.html" class="active">Home</a></li>
      <li><a href="services.html">Services</a></li>
      <li><a href="services.html">About us</a></li>
      <li><a href="portfolio.html">Portfolio</a></li>
      <li><a href="contact.html">Contact</a></li>
      </ul>
   </div>
   <div class="clr"> </div>
</div>
  </div>
  <div class="slider">
<div class="slice1">
   <div id="slider">
      <ul>
      <li>
         <div class="top" style="background:url(images/sliser_bg_img_1.jpg) top no-repeat;">
            <h2><a href="http://www.divcss5.com/">CSS</a> Dummy text of the printing and typesetting industry.</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since the when an unknown printer. <a href="#">Simply dummy text of the printing</a> and typesetting industry. Lorem Ipsum has been the industry's </p>
         </div>
         <div class="bot">
         <div class="lister">
            <p class="active">1</p>
            <p>2</p>
            <p>3</p>
            </div>
            <h2>Simply dummy text</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since.</p>
         </div>
      </li>
      <li>
         <div class="top" style="background:url(images/sliser_bg_img_2.jpg) top no-repeat;">
            <h2>Dummy text of the printing and typesetting industry.</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since the when an unknown printer. <a href="#">Simply dummy text of the printing</a> and typesetting industry. Lorem Ipsum has been the industry's </p>
         </div>
         <div class="bot">
         <div class="lister">
            <p>1</p>
            <p class="active">2</p>
            <p>3</p>
            </div>
            <h2>Simply dummy text</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since.</p>
         </div>
      </li>
      <li>
         <div class="top" style="background:url(images/sliser_bg_img_3.jpg) top no-repeat;">
            <h2>Dummy text of the printing and typesetting industry.</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since the when an unknown printer. <a href="#">Simply dummy text of the printing</a> and typesetting industry. Lorem Ipsum has been the industry's </p>
         </div>
         <div class="bot">
         <div class="lister">
            <p>1</p>
            <p>2</p>
            <p class="active">3</p>
            </div>
            <h2>Simply dummy text</h2>
            <p>Lorem Ipsum has been the industry's standard dummy text ever since.</p>
         </div>
      </li>
      </ul>
   </div>
</div>
  </div>
  <div class="body">
<div class="body_resize">
   <div class="Author">
      <h2>About the Author</h2>
      <img src="images/img_1.gif" alt="picture" width="97" height="89" hspace="20" vspace="5" />
      <p>Lorem Ipsum has been the industry's standard dummy text ever since thes, when an unknown printer.<a href="#"> Simply dummy text</a> of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since thes, when an unknown printer.</p>
      <p><a href="#"><img src="images/read_more.gif" alt="picture" width="68" height="20" border="0" /></a></p>
   </div>
   <div class="animator">
      <p><img src="images/img_4.gif" alt="picture" width="169" height="126" /> <img src="images/img_3.gif" alt="picture" width="169" height="126" /><img src="images/img_2.gif" alt="picture" width="170" height="126" /></p>
      <h2>Dummy text of the printing and typesetting industry.</h2>
      <p>Lorem Ipsum has been the industry's standard dummy text ever since thes,<a href="#"> when an unknown printer. Simply dummy text</a> of the printing and typesetting industry. </p>
   </div>
   <div class="clr"></div>
</div>
<div class="clr"></div>
  </div>
  <div class="FBG">
<div class="Fbg_resize">
   <div class="Twitter">
      <p><img src="images/Twitter.gif" alt="picture" width="129" height="96" /></p>
      <p><strong>Lorem Ipsum has been</strong> The industry's standard dummy text ever since thes. <a href="#"><img src="images/read_more.gif" alt="picture" width="68" height="20" border="0" /></a></p>
   </div>
   <div class="con">
      <h2>Contact us</h2>
      <ul>
      <li>Name of the Company</li>
      <li> 2901 Marmora Road, Glassgow, D04 59GR</li>
      <li> Telephone: +1 234 567 8910</li>
      </ul>
      <ul>
      <li>FAX: +1 234 567 8910</li>
      <li>E-mail: <a href="#">mail@yoursitename.com</a></li>
      </ul>
   </div>
</div>
<div class="clr"></div>
  </div>
  <div class="footer">
<div class="resize">
   <div>Copyright © Sitename.com. <a href="http://www.divcss5.com/">DIV+CSS</a>. All Rights Reserved<br />
      <a href="index.html">Home</a> | <a href="contact.html">Contact</a> | <a href="blog.html">RSS</a></div>
</div>
<p class="clr"></p>
  </div>
</div>
</body>
</html>

作者: zapshl 时间: 2011-5-4 19:35

太好了.就要这个例子.

作者: qweqwe 时间: 2011-5-5 10:06

下载试下

作者: 58436211 时间: 2011-5-5 15:15

好东西啊

作者: cfang2005 时间: 2011-5-9 14:54

看一下

作者: shunshun_10 时间: 2011-5-11 13:18 标题: 很好

作者: dmgyswf 时间: 2011-5-13 09:52

这个菜单效果不错，赞一个

作者: 290678391 时间: 2011-5-16 13:17

可以可以

作者: xfl515 时间: 2011-5-16 16:11

好啊！！！！！顶起来

作者: admin1225 时间: 2011-5-16 18:24

太好了啊

作者: wangpei 时间: 2011-5-18 17:49

看看，学习一下

作者: 1ling 时间: 2011-5-19 16:31

非常的需要

作者: kmyyh0000 时间: 2011-5-23 12:13

111111111111111111111111

作者: yuyu 时间: 2011-5-23 17:30 标题: fewf

fwhgewgwerf wwgwfewrfwef

作者: hzsxyhzc 时间: 2011-5-24 11:31

看看看看哪款哪款

作者: jakes1985 时间: 2011-5-24 12:56

hello word

作者: sunjiuzi 时间: 2011-5-27 10:04

貌似就是我也找的，，不知道行不行呀

作者: 刘晓备 时间: 2011-5-27 12:30

谢谢你拉啊

作者: fengkuangtiaowu 时间: 2011-5-28 09:54 标题: 求打包，谢谢！

求打包，谢谢！求打包，谢谢！

作者: 恋尚飞儿 时间: 2011-5-28 20:26

找的就是这个。。希望代码我看的懂。先下载下来。谢谢楼主了。

作者: 恋尚飞儿 时间: 2011-5-28 20:28

可是。请问要怎样把这个功能添加到网页里面？我是菜鸟，什么都不会，请高手指点，或加我q 177761335 备注：div+css 谢谢了。。谢谢了。。请高手指点。

作者: huajing10 时间: 2011-5-30 09:59

很好用的呢~

作者: ding68 时间: 2011-5-30 10:09

恢复强大

作者: meng1125360002 时间: 2011-5-31 16:47

xuexiyixia

作者: happysea 时间: 2011-6-2 12:42

让我看看啊...

作者: james385 时间: 2011-6-2 14:33

good 太感谢了。

作者: luckycuy 时间: 2011-6-2 19:15

看看看看看卡点点滴滴呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜呜娃娃大啊啊啊啊阿达爱的

作者: dreamcrane 时间: 2011-6-4 22:35

,真是不错啊！

作者: jileshi130 时间: 2011-6-9 12:13 标题: 看看了

看看了看看了看看了看看了

作者: xeifeinfsoft 时间: 2011-6-9 18:00 标题: safafafaf

afadfafasdfafa

作者: tanqian 时间: 2011-6-10 10:19 标题: 正需要

正需要工作下载

作者: jaune162 时间: 2011-6-10 19:41

啊啊啊啊啊啊啊啊啊啊啊

作者: 1137956047 时间: 2011-6-11 22:05

看一下

作者: yzx002 时间: 2011-6-15 10:10 标题: 学习了！！00

学习了！！学习了！！

作者: luckywhw 时间: 2011-6-15 11:22

感谢交流。

作者: 80idea 时间: 2011-6-17 09:19

很需要这个

作者: qw3431667 时间: 2011-6-17 10:30 标题: sdadsasdad

adadasdadadasdadad

作者: li361804721 时间: 2011-6-17 13:21 标题: DIV+CSS下拉导航打包下载（JS动画版）

支持divcss5

作者: akumajing 时间: 2011-6-18 23:06

回复看真相XDDD

作者: zhaoyurichie 时间: 2011-6-19 21:51

哇哇哇哇哇哇哇哇哇哇

作者: 会飞的鱼 时间: 2011-6-20 16:55

看看看看看

作者: maixiao 时间: 2011-6-20 19:43 标题: bucuo

haodongxinioadn

作者: zc227 时间: 2011-6-20 20:23

这个不错

作者: 水晶焰 时间: 2011-6-22 11:15

下载试下

作者: jrdnslm 时间: 2011-6-24 22:46 标题: 不错，不错

不错，不错，先收藏，以后用得着。

作者: coolio 时间: 2011-6-28 09:56

这个不错，终于找到了

作者: shallwin 时间: 2011-6-28 10:38

太好了.就要这个例子.

作者: winds0825 时间: 2011-6-30 12:32

我想要啊。。。

作者: lovemyrice 时间: 2011-6-30 16:05

谢谢啦

作者: 小草丶 时间: 2011-7-1 08:06

谢咯。分享

作者: play100 时间: 2011-7-5 09:24

下载学习

作者: mylylong 时间: 2011-7-6 14:51

作者: mytool 时间: 2011-7-6 19:30

多做几个主题才好。

作者: lesthurt 时间: 2011-7-8 16:47

seeeeeeeeeeee

作者: ml93745401 时间: 2011-7-12 10:56 标题: 下载

我要下载这个例子

作者: jie1226 时间: 2011-7-12 11:19

看看先。

作者: bagoyga 时间: 2011-7-13 14:52

学习一下

作者: fcdjgzkf 时间: 2011-7-13 16:17 标题: 太好了，我急需

非常感谢，我急需的东西！

作者: qingqing_1 时间: 2011-7-14 14:44

作者: happychina 时间: 2011-7-14 17:39

不错啊，不过这个跟上篇有什么区别吗，下来看看

作者: schschsch 时间: 2011-7-16 15:35 标题: 暗色调

按时打算的

作者: a453431529 时间: 2011-7-16 20:22 标题: 幻灯片特效

幻灯片特效

作者: xufou 时间: 2011-7-17 19:36

这个真漂亮啊。。

作者: qq554144374 时间: 2011-7-17 23:31

这个菜单效果不错，赞一个

作者: l917716606 时间: 2011-7-18 15:09

好啊！！！！！顶起来

作者: lcwjay 时间: 2011-7-18 16:17

多谢楼主分享

作者: wwwww 时间: 2011-7-19 12:47

作者: lansefengming 时间: 2011-7-19 22:24

好东西啊、、

作者: M_none 时间: 2011-7-20 11:16

先看看。。。。

作者: tmd2011 时间: 2011-7-21 07:59 标题: 好啊好好啊好好啊好

好啊好好啊好好啊好好啊好好啊好

作者: freshrich 时间: 2011-7-21 17:41 标题: 我回复我光荣

我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣我回复我光荣

作者: gongyaotang 时间: 2011-7-22 17:56 标题: 1

很不错的特效收藏了

作者: yyou316 时间: 2011-7-22 18:45

很不错哦

作者: quanshiai 时间: 2011-7-23 17:13

谢谢~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

作者: xiaoxiao 时间: 2011-7-26 20:15 标题: 回复 1# divcss5文采的帖子

下下来看看

作者: shadow 时间: 2011-7-26 21:06

下载来看看

作者: yangchenguang 时间: 2011-7-27 09:43 标题: 非常好的菜单效果

好的效果，收藏了。

作者: AKAE2 时间: 2011-7-29 09:54

要好好学习下

作者: zhangchaojian 时间: 2011-7-29 17:35 标题: nihao

haojileaaaaaaaa

作者: zhangchaojian 时间: 2011-7-29 17:40 标题: aaaa

addddddddddddddddddddddddddddddddddddddddddddddddaaaaaaaaaaaad

作者: wuwende881208 时间: 2011-7-31 10:45

作者: jiaoxu8 时间: 2011-8-1 15:12

顶······································

作者: kittypaq 时间: 2011-8-1 15:22 标题: 想看看

想看看呢~~~~

作者: ljh888 时间: 2011-8-2 19:59

好东西，收藏了！

作者: brue 时间: 2011-8-3 12:57 标题: 3q3q3q3q3q

3q3q3q3q3q

作者: becauser 时间: 2011-8-4 11:52

3q very much

作者: 凌空的云 时间: 2011-8-8 10:17

顶起好帖必须顶

作者: linkinzoo 时间: 2011-8-14 14:39 标题: 奋斗

俄方圣诞快乐积分开始大幅是

作者: wpl6522832 时间: 2011-8-16 22:20 标题: 技术需要交流

终于找到个能看懂的了

作者: IPQJEPYU 时间: 2011-8-17 09:31

作者: wyljelly520 时间: 2011-8-20 17:15 标题: 回复 1# divcss5文采的帖子

下载来看看啦，哈

作者: 7q8c 时间: 2011-8-23 14:12

好东西啊

作者: lvhua222 时间: 2011-8-25 13:34

不错不错

作者: 443055570 时间: 2011-8-25 13:59

顶顶

作者: jouvie 时间: 2011-8-27 16:42 标题: 下载tab菜单

想下载看下，怎么是隐藏的

作者: lxs30766 时间: 2011-8-27 23:34

收藏起来

作者: suoyu1 时间: 2011-8-29 16:57

查看下

作者: zs9999 时间: 2011-8-30 08:22

好东西啊

作者: 20091260 时间: 2011-8-30 10:42

欢迎光临 CSS论坛 (http://www.divcss5.com/bbs/)