前端侧边栏的修改心得

这是自己第一次使用前段框架进行项目开发，觉得自己要学的东西很多。下面对侧边栏进行修改时遇到的问题进行下总结。

项目背景：项目需求是将原来的二级三级菜单和一级菜单时并排显示的，现在要求把二级三级菜单变成悬浮式，在一级菜单滑动鼠标时，可以滑动出二三级菜单。

             项目前段使用的框架有backBone，seajs,jquery,Marionette。第一次接触到这种模块式的前段开发，虽然编写起来不如以前清晰，但是后期的维护性非常好，比如增加新的功能，只需要增加一个新的模块就可以了。

项目问题：

           1.hover失效

           登陆之后，悬浮状态不能适时出现，得双击一级菜单才行。

          解决方案：有的视图中render 渲染方法，会把hover效果屏蔽掉。所以在每次渲染之后要重新调用实现悬浮的js方法。

          2.div错位

      使用clear:both;在css中，首先我们理解一下clear，顾名思义就是清除的意思，both的意思是全部，那连起来就是清除全部样式，不过这个样式主要是用于对多个div浮动的清除，如float:left,如果不清除，很容易对下面的div造成显示错位.

          3.二级菜单显示时，由于名字过长，出现换行。

解决：（1）文字所在的标签和外部标签之间左右距离过长。padding 属性解决。

         （2）强制不换行解决该问题。

总结：每次开发项目，很多人不可避免的要学习新的技术，我们程序员就是不断充实自己，所以做的项目越多，懂得技术自然就会多。每次学习新的技术对有些人来说是无比的枯燥，不知自己该做什么，该怎样学习。我在学习backbone，seajs是也是这样的感受，自己就是在晚上搜些相关的资料，大体的浏览一遍。等到正在项目时，才发现自己一点不会。而在自己修改菜单栏时，就遇到非常多的问题。不过吧这些问题解决之后。在做其他的功能时，就会得心应手。

所以不要让自己的手停下来，学习新技术时，一定要动手去写。眼手结合才是王道。

转载于:https://www.cnblogs.com/lin-fan/p/5145519.html