点击导航栏滚动到指定位置

由于在写demo的时候,需要完成点击导航栏页面跳转的功能,因此对此做了一些调查。

锚点

锚点是点击跳转的最基础实现手段了,也是大多数网页采用的手段,大胆猜测一下,也是效率最高的方法(据说基于hash,之后再研究一下)https://www.zhangxinxu.com/wordpress/2013/08/url-anchor-html-%E9%94%9A%E7%82%B9%E5%AE%9A%E4%BD%8D%E6%9C%BA%E5%88%B6-%E5%BA%94%E7%94%A8-%E9%97%AE%E9%A2%98/
关于锚点,更多参见旭哥的这篇博客,下面举个小例子

//锚点元素 //点击跳转

需要强调的一点是,锚点的跳转是“闪现”效果,没有滚动和动画,并不是我想要的效果,从交互的感觉上来说,也不是最佳的。

jQuery实现监控滚动与点击跳转

参考https://segmentfault.com/a/1190000009306458这篇博文写了个demo,基本完美实现需求,感叹jQuery设计得真好,我基本没用过jQuery的人也一看就懂会用。
demo

利用css transform

可能是最优雅的一种方法,与vue一起食用

原生js

占坑

你可能感兴趣的:(点击导航栏滚动到指定位置)