这篇文章主要介绍了php+jquery实现的三级导航栏下拉菜单显示效果,涉及php数组遍历与jquery事件响应操作页面元素变换等相关操作技巧,需要的朋友可以参考下
本文实例讲述了php+jQuery实现的三级导航栏下拉菜单显示效果。分享给大家供大家参考，具体如下：
首先看看效果图：
1.数据配置文件 db.php
立即学习“PHP免费学习笔记（深入）”；
'关于我们', 'two' => array( array( 'three_tit' => '公司介绍', 'three_cont' => array( '企业概况', '组织架构', '发展历程', '企业文化', '服务理念' ) ), array( 'three_tit' => '企业荣誉', 'three_cont' => array( '获奖证书', '行业贡献', '资质认证', '协会活动', '公司的成就') ), array( 'three_tit' => '销售网络', 'three_cont' => array( '东北', '华北', '中东', '华南', '西南', '西北' ) ) ) ), array( 'one' => '产品展示', 'two' => array( array( 'three_tit' => '进出口贸易', 'three_cont' => array( '数码产品', '最新能源', '新鲜水果', '肉类食品', '衣服', '金银首饰' ) ), array( 'three_tit' => '商业服务', 'three_cont' => array( '资格认证', '人才培养', '热门商品推荐', '最新科技前沿' ) ) ) ), array( 'one' => '新闻中心', 'two' => array( array( 'three_tit' => '企业动态', 'three_cont' => array( '公司新闻', '新品上市', '企业动态' ) ), array( 'three_tit' => '行业动态', 'three_cont' => array( '媒体聚焦', '业内关注', '国内行情', '国际行情' ) ) ) ), array( 'one' => '联系我们', 'two' => array( array( 'three_tit' => '联系方式', 'three_cont' => array( '在线客服', '通信地址', '电话传真', '在线留言' ) ), array( 'three_tit' => '人才招聘', 'three_cont' => array( '项目经理', '助理秘书', '渠道代理', '网站工程师' ) ) ) ));?>
2.index文件
3.nav.html文件
lns="http://www.w3.org/1999/xhtml"><ｓｃｒｉｐｔ type="text/javascript" src="./js/jquery-1.7.2.min.js"><ｓｃｒｉｐｔ type="text/javascript"> $(function(){ //对元素进行隐藏 $('.menu>li').eq(4).find('s').hide(); $('.two li').last().css('border','none'); //鼠标移入和移出事件 $('.menu li').hover(function(){ $(this).find('.two').show(); //鼠标移入和移出事件 $('.two li').hover(function(){ $(this).find('.hide').show(); },function(){ $(this).find('.hide').hide(); }); },function(){ $(this).find('.two').hide(); }); })无标题文档 
