锚点全屏滚动(jQuery)
来源:互联网 发布:log4j java 代码样例 编辑:程序博客网 时间:2024/06/05 18:24
<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title></title> <style type="text/css"> * { margin: 0; padding: 0; } html, body { height: 100%; } div { height: 100%; } div:nth-child(1) { background: #f00; } div:nth-child(2) { background: #ff0; } div:nth-child(3) { background: #f0f; } div:nth-child(4) { background: #00f; } p{position: fixed;top:0;} </style> </head> <body> <div id="view01"></div> <div id="view02"></div> <div id="view03"></div> <div id="view04"></div> <p> <a href="#view01">1</a> <a href="#view02">2</a> <a href="#view03">3</a> <a href="#view04">4</a> </p> </body> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script type="text/javascript"> $('a[href*=#]').click(function() { if(location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) { var _target = $(this.hash); console.log(this.hash) _target = _target.length && _target || $('[name=' + this.hash.slice(1) + ']'); if(_target.length) { var targetTop = _target.offset().top; $('body').animate({ scrollTop: targetTop }, 1000); return false; } } }); </script></html>
0 0
- 锚点全屏滚动(jQuery)
- jquery 锚点滚动
- Jquery 全屏滚动插件
- jquery全屏滚动效果
- jquery 锚点 滚动 动画
- jQuery锚点滚动js
- jQuery----全屏滚动插件fullPage
- fullpage(jQuery全屏滚动插件)插件的使用
- <jQuery>导航的滚动锚点
- JQuery 锚点连接屏幕滚动
- jQuery 锚点跳转滚动条平滑滚动
- fullpage(全屏滚动)
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js
- jQuery全屏滚动插件fullPage.js
- Jquery单页全屏滚动效果 导航
- jQuery全屏滚动插件fullPage.js演示
- jQuery全屏滚动插件fullPage.js
- android 事件分发
- 2017 SSCTF Writeup
- 内向者首先要做的事情就是接纳自己,不艳羡他人
- JavaWeb前端开发知识总结(CSS)
- DrawerLayout实现抽屉效果
- 锚点全屏滚动(jQuery)
- C++菜鳥的成長之路(2)——Linux下的socket編程(1)
- JavaWeb 02 Servlet
- 错误”ORA-12560: TNS: 协议适配器错误“解决方法
- 每周一本书之《Hadoop金融大数据分析》
- [BZOJ2152]聪聪可可-点分治
- 面试官谈游戏入行--面试和信仰
- 微信小程序多页面传参通信的探索与实践
- CRP小试牛刀:解决“产出物路径不存在”问题。