JavaScript scrollTo() 函数示例

最新推荐文章于 2024-04-17 11:59:13 发布
最新推荐文章于 2024-04-17 11:59:13 发布
阅读量3k 收藏
点赞数
分类专栏： javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/xxz_best/article/details/39581921
版权
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>JavaScript scrollTo() 函数示例</title>
</head>
<body>
<input type="button" value="横向滚动条移动到相对于窗体宽度为20像素的位置，纵向滚动条移动到相对于窗体高度为60像素的位置！" οnclick="window.scrollTo(20,60);" />
<p>潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu潇湘子dreamdu</p>
<p>1潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>2潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>3潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>
<p>潇湘子dreamdu</p>




</body>
</html>
霖霏晗
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
JavaScript简单实现网页回到顶部功能
10-26
JavaScript简单实现网页回到顶部功能,大家可以参考一下
Fullscreen-Scrolling-Page:HTML，CSS和JavaScript示例代码，使用鼠标滚轮事件创建全屏滚动页面
05-03
3. **CSS滚动平滑**：JavaScript可以操作`scroll`属性，配合`smooth`值实现平滑滚动效果，如`window.scrollTo({top: position, behavior: 'smooth'})`。 4. **DOM操作**：通过`querySelector`、`querySelectorAll`等...
View 的滑动实现之二（ScrollTo,ScrollBy和Scroller）
gongzhiyao37390814的博客
10-12 808
在本篇文章的前面，我们讲到了使用Layout的方法实现View的滑动今天给大家介绍一下使用ScrollTo,ScrollBy和Scroller来实现View的滑动。 一、ScrollTo,ScrollBy 在View中，系统专门提供了scrollTo和scrollBy两种方式来改变View的位置，于是我们就可以通过这两个方法实现View的滑动。 我们先来看一下这两个方法的实现：
js如何設置滾動到元素位置
最新发布
前端路上坎坎坷坷，总有一天站在顶峰仰望世界！！！
04-17 954
在JavaScript中，你可以使用方法或元素的方法来设置滚动位置。这些方法允许你将页面滚动到特定的坐标或元素。
JavaScript中的scrollTop（js中的scrollTop，滚动到顶部，javascript滚动到顶部）
热门推荐
weixin_65793170的博客
03-30 1万+
scrollTop是JavaScript中一个非常有用且重要的方法，它用于获取或设置元素的垂直滚动条位置，实现各种滚动相关的功能，无论是回到顶部、滚动到指定位置还是监听滚动事件，都需要用到scrollTop，在本文中，我们将深入了解scrollTop的用法和实际应用，这是一张scrollTop的关系图，仅供参考
JS： scroll()、scrollTo()、scrollBy()，跳转到进度条指定位置,单位是像素
wcdunf的博客
04-29 3802
scroll() 此方法接收两个参数，依次为X坐标和Y坐标；设置滚动条的偏移位置 scrollTo() 此方法和scroll()作用一样，都是设置滚动条的偏移位置。 scrollBy() 此法发同样接收两个参数，不过参数分别为X轴的偏移量和Y轴的偏移量，并且可以增加或者减少。 scroll()例子： scroll(0, 200) ==> 设置滚动条Y轴位置在200像素的地方。比如：当前坐标为0，执行后便是200，当前坐标为100，执行后是200。 scrollTo()例子： scr...
原生JS scroll()、scrollTo()、scrollBy()
weixin_30518397的博客
03-25 493
scroll() 此方法接收两个参数，依次为X坐标和Y坐标；设置滚动条的偏移位置 scrollTo() 此方法和scroll()作用一样，都是设置滚动条的偏移位置。 scrollBy() 此法发同样接收两个参数，不过参数分别为X轴的偏移量和Y轴的偏移量，并且可以增加或者减少。 scroll()例子： scroll(0, 200) ==> 设置滚动条Y轴位置在200像素的地方...
jQuery和JavaScript和vue让子盒子滚动到父盒子的指定位置，包括设置scrollTop到指定位置的值为rem
weixin_44784401的博客
03-07 3150
jQuery和JavaScript和vue让子盒子滚动到父盒子的指定位置，包括设置scrollTop到指定位置的值为rem
JavaScript实现的smooth scroll 平滑滚动菜单demo
05-19
以下是一个基本的平滑滚动函数示例： ```javascript function smoothScroll(targetY) { const startY = window.pageYOffset; const endY = targetY; const distance = endY - startY; const duration = 1000; /...
jquery-scrollto
09-21
jQuery ScrollTo 是一个非常实用的JavaScript库，专为网页滚动效果而设计。这个库允许开发者轻松地创建平滑、动画化的页面滚动效果，使用户体验更加流畅和吸引人。它与jQuery库结合使用，大大简化了对页面元素滚动到...
js定位示例
04-17
在JavaScript中，我们可以利用`window.scrollTo()`函数来实现页面滚动。这个函数接受两个参数，分别代表要滚动到的X轴和Y轴坐标。例如，如果我们想让页面滚动到Y轴坐标为200的位置，可以这样写： ```javascript ...
关于Scroller ，scrollTo，scrollBy
做一个苦行僧的专栏
05-06 960
最近想总结一下，关于View滑动的知识，也为下一篇View的滑动总结记录一下这个知识点点吧。提到这个，先说说Android的坐标系吧。 Android中的坐标系 Android中有2种坐标系，分别称之为Android坐标系和视图坐标系。而对应的也有一些相关的方法可以获取坐标系中的坐标值，只有搞清楚这些区别，才能在使用的时候，不至于出错或者得不到你想要的效果。 1.Andro...
JavaScript中关于滚动scrollBy()与scrollTo()的区别
王跃坤的博客
03-22 2896
先说结论： scrollBy(x,y)是根据当前位置来计算的 scrollTo(x,y)是从原点(0,0)开始计算的 x表示向右滚动的像素数，y表示向下滚动的像素数。 代码： <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>王跃坤</title> <script> function Init(){ var pp=document.getElements
scrollTo函数处理页面滚动问题
Tom_2018的博客
08-04 2979
scrollTo函数 --scrollHeight获取对象的滚动高度。 --scrollLeft设置或获取位于对象左边界和窗口中目前可见内容的最左端之间的距离。 --scrollTop设置或获取位于对象最顶端和窗口中可见内容的最顶端之间的距离。 --scrollWidth获取对象的滚动宽度。 scrollTo函数不存在兼容性问题，直接用这个函数就可以了 #滚动到底部 js = "window.scrollTo(0,document.body.scrollHeight)" driver...
从源码分析scrollTo、scrollBy、Scroller方法的区别和作用
weixin_33847182的博客
08-13 293
目 录（本篇字数：1201） 介绍 区别分析 scrollTo scrollBy Scroller 介绍 今天，我们来讲讲自定义View的基本功，那就是对我们屏幕坐标系的理解。本人画了一张图，咋们凑合看吧，应该不难看懂。 这里做略微的说明，黑色（ViewGroup、父容器）、蓝色（包含的子View）、橙色为手指触摸屏幕的...
使用JavaScript实现回到顶部效果
xuexueq的博客
04-27 434
锚链接 使用锚链接方式实现回到顶部效果,是最简便的一种方式,即将标签a中的href属性值设置为#即可:<a href="#" ></a>,便可实现一键回到顶部效果.为了提供较好的用户体验,这里使用js实现这个功能.功能点 1. 返回顶部的过程是一个由快到慢的滚动过程; 2. 在返回顶部的滚动过程中，如果滚动鼠标滚轮，可暂停在当前位置。 3. 滚动条距离顶部较远时,显示返回顶部按钮,较近时不显
scrollTo和scrollTo.js
iteye_8029的博客
08-18 248
最近做一个项目前端要用到scrollTo和滚动视觉差。顺便把两个东西拿出来温习一下。 HTML DOM里面定义了scrollTo方法，用法：scrollTo(xpos,ypos)，把内容滚动到当前的指定位置。但是这个充其量只能说是移动而不能说是滚动，似乎没有滑动的效果显示出来。好在JQuery提供了足够多方便的插件，其中一个就能够提供平滑滚动的功能，是平滑哦~ 插件叫做jquery.scrol...
jQuery定位跳转插件（jquery.scrollto.js）
年轻的心跳
09-18 6639
作用 jquery.scrollTo-min.js 用户返回顶部及动画到目的地，支持目标值、锚点。 用法 1.引入jQuery 2.$.scrollTo( this.hash || targetValue, time);   example:$.scrollTo( this.hash || 0, 500); 特点 功能少，jquery代码少，逻辑简单，一看就明白。这种简单的jquer...
window.scrollTo滚动速度
04-27
window.scrollTo函数本身不控制滚动速度，它只是将页面滚动到指定位置。如果您想要控制滚动速度，可以使用JavaScript的定时器和一些计算来实现平滑滚动效果。以下是一个示例代码： ```javascript function smooth...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值