平时浏览网站的时候要是网站很长,滑下来后还要返回到开头部分的header来点击导航就显得很不方便,在这里使用JQ来实现右侧的滑动导航条,先来看看效果图吧:
使用jq其实也比较简单啦:你先弄好相应的css样式和html代码,接着直接插入jquery.min.js,然后调用插件。
css样式
html代码
js代码
animate() 方法执行 CSS 属性集的自定义动画。
该方法通过CSS样式将元素从一个状态改变为另一个状态.
$(selector).animate(styles,speed,easing,callback)
styles:必需,规定产生动画效果的css样式和值
speed:可选,规定动画的速度
easing:可选,规定在不同的动画点中设置动画速度的easing函数
callback:可选,animate函数执行完成后,要执行的函数。
相信你们能看懂这些代码,理解起来不难的,真正难的是直接写出来哦,不懂的可以直接百度呢!。
(原文写于2017.8.18)