jquery实现侧边栏的隐藏与显示


           web项目中经常会出现左侧侧边栏,右侧显示内容的web页面。


           效果如图:



      如何实现点击本周食谱,本周食谱的列表隐藏或显示切换,并关闭下周食谱列表显示,点击下周食谱,让下周食谱的列表隐藏切换显示,

  并关闭本周食谱列表显示


      实现思路:

      1.布局:

        布局顶部的topDiv,左侧的leftDiv(optionDiv,navListUl),

        布局右侧的contentDiv.


      布局如图:



       

         2.js控制optionDiv和navListUl

          1.当点击optionDiv的时候添加本次是否点击的in类标记,

           2、移除其他optionDiv


本文转载:CSDN博客