JQuery 实现锚点链接之间的平滑滚动
24. 解决链接锚点的生硬问题
$('.nav .btn[href*=#],.icon2,.icon3').click(function() {
if (location.pathname.replace(/^\//, '') == this.pathname.replace(/^\//, '') && location.hostname == this.hostname) {
var $target = $(this.hash);
$target = $target.length && $target || $('[id=' + this.hash.slice(1) + ']');
if ($target.length) {
var targetOffset = $target.offset().top;
$('html,body').animate({
scrollTop: targetOffset
},
1000);
return false;
}
}
})
JQuery 实现锚点链接之间的平滑滚动的更多相关文章
- jquery 监听所有锚点链接实现平滑移动
jquery 监听所有锚点链接实现平滑移动,地址栏上不会改变链接地址 //监听所有锚点链接实现平滑移动 $('a[href*=#],area[href*=#]').click(function() { ...
- JQuery简单实现锚点链接的平滑滚动
在平时的项目中,我们经常需要一些特效链接,如果使效果进一步加强,我们可以使点击锚点链接平滑滚动到锚点,下面就来给大家讲解下如何使用jQuery来实现. 一般使用锚点来跳转到页面指定位置的时候,会生 ...
- 【前端】jQuery实现锚点向下平滑滚动特效
jQuery实现锚点向下平滑滚动特效 实现效果: 实现原理: 使用jQuery animate()方法实现页面平滑滚动特效 $('html, body').animate({scrollTop: $( ...
- jQuery下锚点的平滑跳转
对于锚点的平滑跳转,我觉得要谨慎使用,在个人站点或是这个效果含有功能提示可以用一用,在一般的商业性质的网站上,权衡来讲,不用更好,当然,这只是我的个人意见.jQuery库已经为我们做了很多的工作了,所 ...
- 使用jquery animate实现锚点慢慢平滑滚动效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery之锚点带动画跳转特效
背景图片为金木研,这是我最爱的一张图. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &quo ...
- div锚点链接跳转
a标签href可跳转到知道dom节点(通过id) 代码 <!DOCTYPE html> <html> <head> <meta name="view ...
- html邮件链接和锚点链接
锚点链接: 锚点链接: 标记:<a name="XXX"></a> 取读:<a href="#XXX"></a> ...
- vue2.0模拟锚点实现定位平滑滚动
vue2.0模拟锚点实现定位平滑滚动 效果为点击哪一个标题,平滑滚动到具体的详情. 如果是传统项目,这个效果就非常简单.但是放到 Vue 中,就有两大难题: 1. 在没有 jQuery 的 anima ...
随机推荐
- BZOJ2435——[Noi2011]道路修建
1.题意:给个树,边的权值=两边的点数差*此边的长度,求所有边的权值和 2.分析:真不想说啥了...dfs即可 #include <cmath> #include <cstdio&g ...
- python 3.x urllib学习
urllib.request import urllib.request as ur url='http://ie.icoa.cn' user_agent = 'Mozilla/4.0 (compat ...
- servlet 之request
request对象中其他功能 一.转发和包含 转发==>用于一个servlet和一个jsp合作处理 servlet用于处理逻辑.jsp用于显示 ...
- Android编程容易犯的错误之一
1.设置TextView的文本颜色 TextView tv; ... tv.setTextColor(R.color.white); 其实这样设置的颜色是 R.color.white的资源ID值所代表 ...
- 如何使用videojs兼容IE8浏览器
需要在服务器下运行 首先我们需要下载videojs包 https://github.com/videojs/video.js/releases 这里简单写了一个小栗子 <!DOCTYPE htm ...
- quartz 线程问题
2个任务一起使用quartz来调度,但是有一个任务总是会莫名其妙的暂停掉,排查了下,原来组内成员在写JOB任务时候,在JOB中写了个while(true) { 执行业务 休眠10分钟} 导 ...
- CSS3颜色渐变模式
1.线性渐变:linear-gradient 语法:<linear-gradient> = linear-gradient([ [ <angle> | to <si ...
- UnrealEd3视图导航
本博客使用的版本:2010-08 [更多其他的UE3版本] [最新的UE3版本 -- 2015-02] [unreal engine wiki] 注:dx11被加入2011-03月版 ...
- 【leetcode】Two Sum
题目简述: Given an array of integers, find two numbers such that they add up to a specific target number ...
- BestCoder Round #86
A题 Price List 巨水..........水的不敢相信. #include <cstdio> typedef long long LL; int main() { int T; ...