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
代码如下: