当前位置:Gxlcms > JavaScript > JS实现导航栏悬停效果(续2)_javascript技巧

JS实现导航栏悬停效果(续2)_javascript技巧

时间:2021-07-01 10:21:17 帮助过:4人阅读

【JS-实现导航栏悬停】
【JS-实现导航栏悬停(续)】

用Jquery重新写完这个页面之后,发现原来的方法还有是有几个问题:

1.首先Js代码冗余,导航条上的Tab是用js实现跳转而不是超链接;

2.还有导航条本身用fixed定位,但没有被设置为水平居中,而是在JS中更改left值使其居中。

问题2就导致了,当浏览器窗口尺寸发生变化的时候,浏览器中的div的位置都发生了变化,也就导致了没法通过页面中的div动态的给已fixed定位的导航条来定位。

最终的代码更改如下:

test.html
代码如下: