js实现导航栏的悬停效果（续）

上一次到达导航栏}时，导航栏中的悬停页面运行在IE上，导航栏不断抖动。

解决方案如下：

从原来的绝对固定的导航栏的定位方法，不知道为什么改为固定的，不动摇，_ - | |
复制代码代码如下所示：
div.navigation {
宽度：800px；
身高：40px；
背景：红色；
保证金：4px汽车0；
上图：400px；
左：0px；
位置：固定；
}

由于这个原因，JS也不得不做相应的修改。

由于固定定位是基于浏览器的可视区域，所以导航条的位置必须改变。
复制代码代码如下所示：
页面上的原始记录导航位置
无功naviga_offsettop = 0；
无功naviga_offsetleft = 0；

/ / IE7不确定getelementsbyclassname，为了与一个定制的兼容
功能my_getelementsbyclassname（class_name）{
var = { }；
获取所有元素
_el = document.getelementsbytagname（*）；
通过类名/刷
对于（var i = 0；i < _el.length；i++）{
如果（_el {我}，{ class_name classname = =）
埃尔{ } = { EL。长度_el我}；
}
}
返回El；
}

导航，在顶部悬停
功能naviga_stay_top（）{
无功a_navigation_bar = { }；
如果（文件。getelementsbyclassname）{ / /铬，FF
a_navigation_bar = document.getelementsbyclassname（导航）；
否则{ { }
a_navigation_bar = my_getelementsbyclassname（导航）；
}
VaR scrollTop = document.body.scrolltop document.documentelement.scrolltop | |；

document.title = scrollTop；
如果向下滚动距离大于导航条顶部的原始距离。
导航栏固定在可见区域的顶部。
如果（scrollTop > naviga_offsettop）{
a_navigation_bar { 0 }。style.top = 0 +PX；
{人}
如果从导航条顶部的原始距离向下滚动，则计算导航条的位置。
a_navigation_bar { 0 }。style.top =（naviga_offsettop - scrollTop）+PX；
}
}

对四选项卡上的导航栏加上单击事件。
窗口。指针函数（）{
无功a_tabs = { }；
如果（文件。getelementsbyclassname）{ / /铬，FF
a_tabs = document.getelementsbyclassname（标签）；
}伊江
a_tabs = my_getelementsbyclassname（标签）；
}

无功a_contents = { }；
如果（文件。getelementsbyclassname）{ / /铬，FF
a_contents = document.getelementsbyclassname（内容）；
}伊江
a_contents = my_getelementsbyclassname（内容）；
}

让 / / offsetleft，即从导航栏的左边框的距离
无功a_main_div = { }；
如果（文件。getelementsbyclassname）{ / /铬，FF
a_main_div = document.getelementsbyclassname（主要）；
}伊江
a_main_div = my_getelementsbyclassname（主要）；
}
naviga_offsetleft = a_main_div { 0 }。offsetleft；

a_tabs { 0 }。onclick =函数（）{
window.scrollto（0，a_contents { 2 }。offsettop）；
}
a_tabs { 1 }。onclick =函数（）{
window.scrollto（0，a_contents { 3 }。offsettop）；
}
a_tabs { 2 }。onclick =函数（）{
window.scrollto（0，a_contents { 4 }。offsettop）；
}
a_tabs { 3 }。onclick =函数（）{
window.scrollto（0，a_contents { 5 }。offsettop）；
}

获取页面，导航栏到顶部位置
无功a_navigation_bar = { }；
如果（文件。getelementsbyclassname）{ / /铬，FF
a_navigation_bar = document.getelementsbyclassname（导航）；
否则{ { }
a_navigation_bar = my_getelementsbyclassname（导航）；
}
让 / / offsettop
naviga_offsettop = a_navigation_bar { 0 }。offsettop；
a_navigation_bar { 0 }。style.left = naviga_offsetleft +PX；

对滚动条和带有滚动事件的鼠标
如果（窗口。attachevent） / /伊江
{
window.attachevent（onmousewheel
window.attachevent（onscroll

document.attachevent（onmousewheel
document.attachevent（onscroll
}，否则，即
Window.addEventListener（滚轮
Window.addEventListener（滚动

Document.addEventListener（滚轮
Document.addEventListener（滚动
}
}

在这个问题中，重要的是要理解不同位置（相对、绝对、静态、固定）之间的区别。

相对的，绝对的，静态的，固定的

首先看看每个属性值的定义：

1、静态：默认值。没有位置，元素出现在正常流量（忽略的顶部，底部，左，右，或属性声明）。

2、相对：生成元素的相对位置，通过顶部，底部，左，右的设置相对于其正常位置，层次可分的特性。

3、绝对：生成绝对定位的元素的位置相对于其他比静态定位的第一个元素的位置，用属性左层次可以分为按Z-INDEX定义。

4、固定：创建一个绝对定位的元素置于相对于浏览器窗口。该元素的位置是由属性左层次可以分为按Z-INDEX定义。

对静态和固定的定位方式有了更好的理解，并没有进行分析，对应用的相对性和绝对性进行了分析。

1，相对。处于相对位置的元素不在正常文本流中，但其在文本流中的位置仍然存在。例如，图1：

图1
黄色背景层位于相对位置，红色边界区域在正常流动中处于位置，通过左上角定位后，从灰色背景的位置可以看到其正常位置仍然存在。

2，绝对值。绝对层与普通文本流分离，但与相对的区别在于它在正常流中的位置不存在。例如，图2：

图2
可以看到，在黄色背景层被定位为绝对值后，灰色背景层会自动填充。

3，相对与绝对的主要区别：

首先，上面提到的位置是正常流动还是不流动。

第二，相对位置的层总是与其最近的父相相对，而不管父元素的位置。例如，图3：

图3
在图中，红色背景层是相对位置，它的直接父绿色背景层是默认的静态位置。红色背景层相对于绿色背景层顶部，左边20个元素。如果红色背景层是绝对的，情况类似于图4。

图4
你可以看到，红色背景层还定义了顶：20px；左：20px；但其相对要素变成黄色背景层，位于绝对或相对的方式。因此，绝对的位置总是相对于父层是最近定义为绝对或相对的，和父层不一定是直接的父层。如果绝对或相对不在父层的定义，它将定位相对主体，如图5：

图5
除了顶部、左侧、右侧和底部定位外，边距属性值的定义也符合上述规则。