我没有添加任何东西，这是Dreamweaver原汁原味用spry创建的菜单栏，以此来学习菜单导航，哈哈。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Javascript之spry菜单栏</title>
<script src="http://files.cnblogs.com/files/caidupingblogs/SpryMenuBar.js" type="text/javascript"></script>
<link href="http://files.cnblogs.com/files/caidupingblogs/SpryMenuBarHorizontal.css" rel="stylesheet" type="text/css" />
</head>

<body>
<ul id="MenuBar1" class="MenuBarHorizontal">
<li><a class="MenuBarItemSubmenu" href="#">项目 1</a>
<ul>
<li><a href="#">项目 1.1</a></li>
<li><a href="#">项目 1.2</a></li>
<li><a href="#">项目 1.3</a></li>
</ul>
</li>
<li><a href="#">项目 2</a></li>
<li><a class="MenuBarItemSubmenu" href="#">项目 3</a>
<ul>
<li><a class="MenuBarItemSubmenu" href="#">项目 3.1</a>
<ul>
<li><a href="#">项目 3.1.1</a></li>
<li><a href="#">项目 3.1.2</a></li>
</ul>
</li>
<li><a href="#">项目 3.2</a></li>
<li><a href="#">项目 3.3</a></li>
</ul>
</li>
<li><a href="#">项目 4</a></li>
</ul>
<script type="text/javascript">
<!--
var MenuBar1 = new Spry.Widget.MenuBar("MenuBar1", {imgDown:"http://files.cnblogs.com/files/caidupingblogs/SpryMenuBarDownHover.gif", imgRight:"http://files.cnblogs.com/files/caidupingblogs/SpryMenuBarRightHover.gif"});
//-->
</script>
</body>

//

Javascript之spry菜单栏的更多相关文章

  1. spry菜单栏(一)

    spry菜单栏使用教程 关于 Spry 框架 Spry 框架是一个 JavaScript 库,Web 设计人员使用它可以构建能够向站点访问者提供更丰富体验的 Web 页.有了 Spry,就可以使用 H ...

  2. spry菜单栏(二)

    自定义选项卡式面板构件 尽管使用属性检查器可以简化对选项卡式面板构件的编辑,但是属性检查器并不支持自定义的样式设置任务.您可以修改选项卡式面板构件的 CSS 规则,并创建根据自己的喜好设置样式的构件. ...

  3. 优秀的JavaScript开发框架

    JavaScript基本上是一个面向对象的脚本语言,创建web应用程序和互动网站.Javascript框架也被称为Javascript库.JavaScript框架很容易提高设计web开发工作,提供了许 ...

  4. 16 款最流行的 JavaScript 框架

    本文列举了16个当前最流行的JavaScript框架.在这个列表中,既包括jQuery和Mootools,也有Zepo移动JavaScript框架. 里面一定有你正在用的或想尝试用的JavaScrip ...

  5. 16 款最流行的JavaScript 框架

    1. jQuery – Javascript框架 jQuery 是最流行的 JavaScript 框架,它简化了HTML 文档遍历.事件处理.动画和Ajax交互.jQuery插件非常之多. 2. Do ...

  6. 赶快收藏！16款最流行的 JavaScript 框架

    下面为大家介绍 16款最流行的 JavaScript 框架,赶快收藏! 1. jQuery – Javascript框架 jQuery 是最流行的 JavaScript 框架,它简化了HTML 文档遍 ...

  7. Adobe Dreamweaver代码编辑

    Adobe Dreamweaver 同义词 DW(Adobe Dreamweaver的缩写)一般指Adobe Dreamweaver Adobe Dreamweaver,简称“DW”,中文名称 &qu ...

  8. Dreamweaver 2

    1.CSS样式基本应用 1.1 概念 层叠样式表 <style type="text/css">body {background-color: #F00;} p{col ...

  9. 超实用的JavaScript代码段 Item2 --伸缩菜单栏

    伸缩菜单栏 点击标题时判断该标题下的菜单是否显示,如果是显示的则将其隐藏,如果是隐藏的则将其显示出来. <!doctype html> <html lang="en&quo ...

随机推荐

  1. when not exists 用法

    USE [ChangHong_612]GO/****** Object: StoredProcedure [dbo].[st_MES_UpdateInspectResult] Script Date: ...

  2. CSS基础(01)

    1. Css基础 1.1 CSS(层叠样式表 Multiple Styles)   CSS 是 Cascading Style Sheets(层叠样式表)的简称. CSS 语言是一种标记语言,它不需要 ...

  3. 解决VS2012新建MVC4等项目时，收到加载程序集“NuGet.VisualStudio.Interop…”的错误

    初装V2012,新建MVC4新项目时出现以下错误: 解决方法为: 通过VS2012的“工具-扩展和更新-联机”安装“NuGet Package Manager”扩展包,可以顺利新建MVC4项目啦!

  4. ios开发——实用技术篇OC篇&iOS的主要框架

    iOS的主要框架         阅读目录 Foundation框架为所有的应用程序提供基本系统服务 UIKit框架提供创建基于触摸用户界面的类 Core Data框架管着理应用程序数据模型 Core ...

  5. Eclipse 环境下安装PhoneGap开发插件

    phoneGap开发跨所有移动平台软件已经成为未来移动终端开发的总趋势,如何在大家所熟悉的Eclipse IDE中快速安装PhoneGap开发插件,介绍如下: 点击help——>install ...

  6. C++中new与delete问题学习

    一．new char与delete问题 . 问题程序 [cpp] view plaincopy #include <iostream> using namespace std; void ...

  7. mydumper原理2

    使用mydumper备份发生Waiting for table flush,导致所有线程都无法读和写 版本 mydumper 0.9.1OS centos6.6 X86_64mysql 5.6.25- ...

  8. Ruby on Rails Tutorial 第三章 静态页面

    1.生成静态页面 $ rails generate controller StaticPages home help    #生成主页和帮助页面的路由.控制器及静态页面 $ rails destroy ...

  9. Jordan Lecture Note-1: Introduction

    Jordan Lecture Note-1: Introduction 第一部分要整理的是Jordan的讲义,这份讲义是我刚进实验室时我们老师给我的第一个任务,要求我把讲义上的知识扩充出去,然后每周都 ...

  10. 模板方法模式(Template Method)

    @@@模式定义: 定义一个操作中的算法的骨架,而将一些步骤延迟到子类中. 模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤. @@@练习示例:  登录控制 @@@示例代码: \s ...