通过使用jquery设置隐藏显示菜单栏

Original 2018-12-27 00:53:01 229
abstract: $(document).ready(function(){   //隐藏二级与三级下拉菜单    $('.twobox').hide()    $('.three').hide()   //当鼠标移动到包含二级菜单的一级菜单时显示当前二级菜单       

$(document).ready(function(){

  //隐藏二级与三级下拉菜单

   $('.twobox').hide()

   $('.three').hide()

  //当鼠标移动到包含二级菜单的一级菜单时显示当前二级菜单

           $('.one>li').mouseover(function(){

            $(this).find('.twobox').slideDown(500)

           })


  //当鼠标移出包含二级菜单的一级菜单时隐藏当前二级菜单

           $('.one>li').mouseleave(function(){

            $(this).find('.twobox').slideUp(500)

            })


  //当鼠标移动到包含三级菜单的二级菜单时显示当前三级菜单

            $('.two').mouseover(function(){

            $(this).find('.three').slideDown(500)

           })


  //当鼠标移出包含三级菜单的二级菜单时隐藏当前三级菜单

  $('.two').mouseleave(function(){

            $(this).find('.three').slideUp(500)

            })

  

})


Correcting teacher:查无此人Correction time:2018-12-27 09:22:41
Teacher's summary:三级联动,做的不错。不过没有html代码,没办法验证效果。相信你做的是对的,加油。

Release Notes

Popular Entries