前段开发过程遇到的问题以及解决方案

问题1：使用mouseover，mouseout 切换div的显示和隐藏时，div出现晃动

解决方案1：将mouseover，mouseout方法改成mouseenter，mouseleave方法，没有什么实际作用

解决方法2：设置一个100-200的延时，div切换不晃动了，因为有延时

原因分析：mouseover() 方法触发 mouseover 事件，或规定当发生 mouseover 事件时运行的函数，与 mouseenter 事件不同，不论鼠标指针穿过被选元素或其子元素，都会触发 mouseover 事件。只有在鼠标指针穿过被选元素时，才会触发 mouseenter 事件。

问题2：使用img时，默认下方会出现一条白色的间隙

解决方案1：如果图片是一个单独的部分，那么将图片的display设置为block

原因分析：图片文字等inline元素默认是和父级元素的baseline对齐的，而baseline又和父级底边有一定距离（这个距离和 font-size，font-family 有关），所以设置 vertical-align:top/bottom/text-top/text-bottom 都可以避免这种情况出现。block元素中包含img均会有这个现象。 

问题3：将li的display设置成inline-block时，上下左右均为出现一个空白间隙

解决方案1：设置父元素的font-size=0;

原因分析：

问题4：图片轮播过程中使用clone()克隆元素并拼接后，无法获取元素的顺序

解决方案1：jquery1.9版本前使用live()方法

解决办法2：jquery1.9版本后使用on()方法

原因分析：元素添加时间时无法为未来生成的元素绑定上事件方法。

问题5：使用on()方法绑定hover()事件

解决方案1:$(父选择器).on(“mouseover mouseout”，“要绑定到的地方的选择器”，function(event){

if(event.type=="mouseover"){

.......

}

else{

.......

}

});

问题6：ie8在调试模式下运行正常，在浏览器模式下运行不正常

解决方案1：去掉代码中用于调试的console.log()语句

原因分析：console.log 在 IE8，但直到你打开 DevTools，并不创建控制台对象。因此，对 console.log 的调用可能导致错误，

http://stackoverflow.com/questions/690251/what-happened-to-console-log-in-ie8

问题7：设置图片的固定宽高，可是图片的尺寸比设置的小

原因：设置了图片的padding，导致图片的宽高被压缩了。