【前端】js实现简单li点击特效

发布时间:2018-06-11 14:31:24

  每一个网页都有导航栏,那么怎么给导航栏增加点击特效呢

  那么接下来就给大家讲解一个简单的导航栏特效。

  整体思路:点击当前li元素后是用removeClass()删除所有兄弟元素(使用siblings()获取)的class样式,然后使用addClass()为当前li添加class。

  具体演示如下:

  1.首先需要写一个基本的html页面:

4{ZAPK8@Y88CNCZRYW(CN85.png

  2.然后写css样式

Q~16M7@C6JU$}7I4}WZAFLA.png

  3.写完css样式后,我们就需要写jquery的代码了

在写之前我们需要引入jquery文件,引入完了之后,就可以开始写了

`~13%EXSOXEHO0~}4A`I786.png

完整代码如下

]X@324D{@_QQT7EWDR{7G`N.png

    远近互联前端小华整理发布,希望能对学习技术的你有所帮助


【相关推荐】