问题标签 [smooth-scrolling]
For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.
jquery - jQuery平滑滚动
我试图实现平滑滚动到信息索引。我已经查看了这个 jsFiddle http://jsfiddle.net/9SDLw/,但我无法让它工作。将代码插入 HTML 文档的位置是否重要?
这是我的代码:
JS(在文件头):
标记:
关联
锚
我在这里想念什么?
jquery - 使用 fadeIN 函数限制链接标签以具有平滑滚动效果
当单击标签(导航)时,我有一个具有平滑滚动效果的单页网站a
,其中一个导航条目还调用了带有fadeIN函数的隐藏div(input.box),我的问题是每当带有fadeIN函数的条目显示时,页面也向下滑动了一点。我应该如何限制这个带有淡入淡出功能的菜单也不能滚动?我的 jsfiddle 波纹管上有用于平滑滚动和淡入淡出的代码。
javascript - 如何通过可拖动对象滚动视口
我正在使用 jQuery 的可拖动功能。视口 div 是整个窗口的大小。视口中有一个可拖动的容器 div,它比视口本身大得多,给人一种透过窗口看容器的小部分的感觉。容器包含对象 div,它们也是可拖动的。
目前,我让容器 div 正确拖动,并且对象 div 也可以在视口 div 周围正确拖动。我遇到的问题是,如果对象 div 位于视口 div 边缘的特定像素范围内,我想“推动”视口。
JQuery 的可拖动函数有一个拖动事件,我一直试图在对象上使用它。我可以让视口滚动,但它需要鼠标始终保持对象移动以保持滚动。我希望对象在像素范围内并且不能移动鼠标但仍然滚动。我目前不知所措,因为我似乎找不到任何真正符合我要求的解决方案。任何帮助将不胜感激,并以我的感激之情回报。
要查看我在做什么的示例,请访问http://jsfiddle.net/trVZA/10/。当拖动红色框时,黑色物体会四处拖动。我已经在对象的拖动事件中注释掉了我的代码,因为它会完全冻结浏览器,但是你可以看到我的错误。当对象靠近墙壁时,我希望背景水图像滚动。
jquery - jQuery 平滑 div 滚动滚动速度左边比右边快很多
我目前正在尝试使用 Smooth Div Scroll (http://www.smoothdivscroll.com/) 在网站上制作“全屏”产品组合。我有一个问题,左滚动比右滚动快得多。我在演示中注意到它们的速度相同,我无法弄清楚为什么它对我的生活不起作用。我在下面粘贴了 CSS 和 JS。我还提供了该网站的链接。如果有人对我如何解决这个问题有任何想法,我将不胜感激!
CSS:
JS:
网站:
http://lightboxwebsitedesign.co.uk/newsite/full-screen-portfolio/
jquery - 平滑 Div 滚动暂停/播放
http://www.smoothdivscroll.com的滚动功能正是我们正在寻找的,但是当您在滑块中移动图像然后当您将鼠标移出滚动时,我们特别需要让滚动“暂停”会再玩。目前,当您将鼠标悬停在图像上时,滚动会继续,我们如何在鼠标悬停和鼠标移出时暂停和播放?左右箭头也一样。一旦您与这些交互,滚动条就会完全停止,我们希望它在您将鼠标从箭头中移出后再次自动播放。
任何帮助将不胜感激!
jquery - Jquery Smoothscroll 函数 - 如何控制动画速度?
任何人都可以帮助我吗?尝试使用我的平滑滚动和控制速度添加“慢”功能。
希望实现真正的“流畅滚动”。
以下是代码:
jquery - 禁用默认箭头键滚动行为以删除 jQuery.scrollTo() 抖动
我正在尝试使用该jQuery
插件.scrollTo()
,以便使用箭头键平滑滚动到网页的特定部分。即当按下时,浏览器将平滑滚动到div
列表中的下一个divs
。但是,由于箭头键通常与 Web 浏览器中的滚动功能绑定,因此当按下箭头键触发该功能时会产生抖动效果。.scrollTo()
看起来,当按下箭头键时,浏览器首先会很快尝试正常滚动而不平滑,然后很快就会通过该scrollTo()
功能开始平滑滚动。
我通常会想象一个人可能能够简单地return false
为 keydown 事件jQuery
以防止发生任何滚动,但这也可以防止.scrollTo()
被箭头键按下触发。
是否有一种简单的方法可以在浏览器中禁用默认箭头键触发的滚动行为,以允许箭头键仅触发.scrollTo()
事件?
javascript - 特定锚链接的平滑滚动
我将 Google 的平滑滚动脚本用于特定的锚链接#tothetop
,而不仅仅是任何#
一个。我在 example.js 文件(您使用脚本下载)中完成了此操作:
改变:
至:
所以现在它只将平滑滚动应用于#tothetop
,但我如何将它应用于其他不同的锚链接?例如:#tothetop
, #tothebottom
, #gotothepub
, 等?(不要问我为什么不使用“#”,因为这是一个很长的故事,但简而言之 - 它与页面上的另一个脚本冲突)我试过了:
但这不起作用。我对 Javascript 和 PHP 不太了解,但我确信有一种简单的方法可以做到这一点?
example.js 的完整代码如下:
jquery - 视差双向滚动
我正在尝试在Scrollorama的帮助下创建视差滚动站点,但我想使用非典型动画。此动画应该从上到下,然后在页面中间停止并返回(从中间到顶部)。Scrollorama作者说scrollorama不支持这种动画,他的新插件SuperScrollorama也不支持。也许有人可以向我推荐另一个具有此功能的插件。
jquery - 单页网站在错误的部分打开
所以我创建了一个单页网站,它使用 jQuery 平滑滚动导航到网站的各个部分。出于某种原因,当我在浏览器中打开页面时(我在多个浏览器和计算机上进行了测试),网站会在页面的中间而不是页面的顶部打开。
这是我用来创建平滑滚动的脚本。
这是网站
在此先感谢,汤姆