html页面怎么加向下滚动,如何使用jQuery向上或向下滚动页面到锚点？

如何使用jQuery向上或向下滚动页面到锚点？

我正在寻找一种方法来包含幻灯片效果，当您单击页面上或下的本地锚点链接时。

我想要一个你有这样一个链接的东西：link text, img etc.

也许添加了一个类，所以你知道你希望这个链接是一个滑动链接：link text, img etc.

然后，如果单击此链接，页面将向上或向下滑动到所需位置(可以是div，标题，页面顶部等)。

这就是我以前的情况：$(document).ready(function(){

$(".scroll").click(function(event){

//prevent the default action for the click event

event.preventDefault();

//get the full url - like mysitecom/index.htm#home

var full_url = this.href;

//split the url by # and get the anchor target name - home in mysitecom/index.htm#home

var parts = full_url.split("#");

var trgt = parts[1];

//get the top offset of the target anchor

var target_offset = $("#"+trgt).offset();

var target_top = target_offset.top;

//goto that anchor by setting the body scroll top to anchor top

$('html, body').animate({scrollTop:target_top}, 1500, 'easeInSine');

});});

html页面怎么加向下滚动,如何使用jQuery向上或向下滚动页面到锚点？相关推荐

java向上和向下的区别_Java的向上和向下转型
在Java编程中经常碰到类型转换,对象类型转换主要包括向上转型和向下转型. 向上转型我们在现实中常常这样说:这个人会唱歌.在这里,我们并不关心这个人是黑人还是白人,是成人还是小孩,也就是说我们更倾向 ...
c语言的除法向上还是向下取整,C语言向上或向下取整函数
点击上方 " 畅学电子 " 一键关注,轻松学习电子知识畅学电子网订阅号每天更新电子行业技术文章,及单片机最新资讯,随时随地轻松学习 C语言有以下几种取整方法: 1.直接赋值给整数变 ...
nginx加载html目录下图片,nginx配置访问图片路径以及html静态页面的调取方法
nginx配置访问图片路径以及html静态页面的调取方法发布时间:2017-03-09 12:06 来源:互联网当前栏目:web技术类给大家讲一个快速配置nginx访问图片地址,以及访问html ...
layui导航栏页面滚动固定_帮你搞定长滚动网页的设计！这5种设计策略需谨记！...
网站中的内容再好,总得让用户能看到,才有价值,而矛盾在于,首屏的空间始终是有限的.所以,我们总希望用户能够滚动页面向下看,从某种意义上来说,长滚动页面和无限滚动的设计,如此地受欢迎,就是因为它贴合了用 ...
浏览器页面资源加载过程与优化
评价页面性能好坏的核心之一就是页面的加载速度,而页面加载速度的关键就是页面资源的加载.本文将从浏览器浏览器页面资源加载过程展开分析,来引出页面关键请求路径的概念,并给出如何优化该关键请求路径的一些方法 ...
vue网页预加载页面_页面预加载效果
vue网页预加载页面 View demo 查看演示Download Source 下载源 Today we want to show you how to create a very simple p ...
html页面预加载图片不出来,页面图片预加载与懒加载策略
在图片的加载策略之前,我们先来了解下html网页中,图片的不同位置的图片分别是在什么时候发起图片资源请求的 img 标签 img标签会在html渲染解析到的时候,如果解析到img src值,则浏览器会 ...
html如何实现页面懒加载,原生JS如何实现图片懒加载
懒加载简介什么是图片懒加载懒加载其实就是延迟加载,是一种对网页性能优化的方式,比如当访问一个页面的时候,优先显示可视区域的图片而不一次性加载所有图片,当需要显示的时候再发送图片请求,避免打开网页时 ...
前端页面图片加载优化
前端页面图片加载优化问题:前端页面如果图片资源过多或者过大就会导致用户加载图片时间过长,导致用户体验下降我总结的优化思路与方法有以下几种一.将图标换成icon字体管理如果项目存在大量的图表用的 ...

html页面怎么加向下滚动,如何使用jQuery向上或向下滚动页面到锚点？

html页面怎么加向下滚动,如何使用jQuery向上或向下滚动页面到锚点？相关推荐

最新文章

热门文章