一款多浏览器兼容的javascript多级下拉菜单

时间:2022-05-30 18:43:33

这个多级下拉菜单的脚本大小不到2K,带有动画效果,可以方便地支持多个实例,并且能良好兼容WordPress系统wp_list_cats和wp_list_pages生成的多级列表。
要初始化一个菜单,只需要以下代码:

    var menu=new menu.dd("menu");
menu.init("menu","menuhover");

你必须在菜单初始化之前创建一个菜单实例。脚本里的menu.dd是菜单的实例名,函数object.init采用了两个参数:菜单的无序列表ID和最初排序的列名(可选)。如果你不想进行排序,可以添加class=“nosort”到适当的表头。菜单的样式完全由CSS定义。
此弹出菜单已经在Firefox 2/3,IE 6/7/8,Opera,Safari 和 Chrome 上测试通过。但需要注意的是,菜单动画在在Firefox 2 和Opera 下无效,但并不影响下拉效果。

下载:http://files.cnblogs.com/xuezhizhang/dropdown-menu.zip

参考:http://blog.imbolo.com/javascript-dropdown-menu-with-multi-levels/

http://www.scriptiny.com/2008/11/drop-down-menu/

一款多浏览器兼容的javascript多级下拉菜单的更多相关文章

  1. jquery实现多级下拉菜单

    支持多种浏览器,体验效果:http://keleyi.com/keleyi/phtml/jqmenu/4.htm 多级菜单,理论上支持无限多的层级,文件结构非常简单的,以下是完整代码: <!DO ...

  2. 基于jQuery带图标的多级下拉菜单

    之前为大家分享了很多导航菜单.今天我们要来分享一款很不错的jQuery左侧带小图标的多级下拉菜单,菜单是垂直的,每一个菜单项带有一个小图标,看起来非常专业.并且菜单支持无限极下拉,所以对各位Web开发 ...

  3. &lpar;JavaScript插件——下拉菜单&rpar;

    前言 阅读之前您也可以到Bootstrap3.0入门学习系列导航中进行查看http://www.cnblogs.com/aehyok/p/3404867.html 本文主要来学习一下JavaScrip ...

  4. 小程序多级下拉菜单demo

    小程序多级下拉菜单demo - CSDN博客 https://blog.csdn.net/github_39371177/article/details/80251211

  5. bootstrap多级下拉菜单

    只需为下拉菜单的任意 <li> 元素添加 .dropdown-submenu 的类,并在该 <li> 元素下添加 .dropdown-menu 类的列表,就可以为该菜单项添加一 ...

  6. jQuery制作水平多级下拉菜单

    本篇体验使用jQuery制作水平的.多级的.下拉菜单. 下拉菜单的html部分如下. <body> <nav class="main-nav"> <u ...

  7. 兼容ie7的导航下拉菜单

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. javascript 横向下拉菜单演示

    <html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN"><head><me ...

  9. javascript实现下拉菜单的显示与隐藏

    demo.html <!DOCTYPE html> <html lang="en"> <head> <meta charset=&quot ...

随机推荐

  1. 一个java文件中可包含多个main方法

    java中的main方法是java应用程序的入口,java程序在运行时,首先调用执行main方法.但并不是说java中只能有一个main方法,不同类中都可以包含main方法.当JVM进行编译时,会提示 ...

  2. android 启动模式介绍

    Android启动模式 (1)Task:与Android系统是个多任务的系统中的任务是不同的.后者更倾向于多进程和多线程来说的,而这里的任务与application(应用程序)和activity(活动 ...

  3. 模态窗口插件之Jbox

    $.jBox.tip("报损数量不能大于库存数!", 'error'); $.jBox.tip("请选择要报损的产品", "warn"); ...

  4. Zabbix源码包安装

    Zabbix源码包安装 Cenos5.3 Basic server 安装顺序 Libxml2 Libmcrypt Zlib Libpng Jpeg:需要创建目录jpeg  /bin  /lib   / ...

  5. 【JavaScript】前端开发框架三剑客—AngularJS VS&period; Backone&period;js VS&period;Ember&period;js

    摘要:透过对Github,*,YouTube等社区进行数据收集后可知,AngularJS在各大主流社区中都是最受欢迎的,Backbone.js与Ember.js则不相伯仲.本文 ...

  6. mixpanel实验教程&lpar;2&rpar;

    六.发送邮件和推送通知 选择该用户前面的 checkbox,点击 Send A Notification button,从下拉列表中选择 Email Message/Push Notifiaction ...

  7. POJ 1745 Divisibility &lpar;线性dp&rpar;

    Divisibility Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 10598   Accepted: 3787 Des ...

  8. foreach 循环的应用传值

    $arr=array(1,5,8,8,9);foreach ($arr as $key => $value) { //这里可以一边改外面$arr的值一边下一步循环 $value=++$value ...

  9. AJAX快速上手和基本核心

    一.快速上手AJAX 使用ajax的过程可以类比平常我们访问网页过程 1.创建一个XMLHttpRequest类型的对象------相当于打开了浏览器 var xhr = new XMLHttpReq ...

  10. JMS消息队列之ActiveMQ简单示例

      废话不多说,在进入主题前先看一张图,对ActiveMQ有个大体的了解:   下面进入主题:   1.添加需要的maven依赖 <!-- active mq begin --> < ...