单元6设计导航菜单类网页特效(JavaScript+jQuery网页特效设计实例).ppt

单元6 设计导航菜单类网页特效 任务6-1 应用className和display 等属性实现横向下拉菜单 网页0601.html中的导航菜单如图6-1所示。 图6-1　网页0601.html中的导航菜单 任务6-2 应用jQuery的hover事件和addClass等方法实现横向导航菜单 网页0602.html中的导航菜单如图6-2所示。 图6-2　网页0602.html中的导航菜单 任务6-3 应用jQuery的bind和attr等方法实现纵向导航菜单 网页0603.html中的导航菜单如图6-3所示。 图6-3　网页0603.html中的导航菜单 【知识必备】 6.1　JavaScript的this指针 6.2　jQuery的属性操作方法 1. jQuery的addClass()方法 2. jQuery的removeClass()方法 3. jQuery的toggleClass()方法 6.3　jQuery的CSS操作方法 1. 获取页面元素的CSS属性 2. 设置页面元素的一个CSS属性 3. 设置页面元素的多个CSS 属性 【引导训练】 任务6-4 应用JavaScript的onmouseover等 事件和className属性设计横向导航菜单 【任务描述】 网页0604.html中的导航菜单如图6-4所