Tag: 滚动

在滚动和点击事件上向上和向下移动Div？: 我想创建一个类似于chanel.com的网站，如果向下滚动，新的div会移动到页面顶部。不同之处在于，在我设计的网站上，它也应该对点击产生相同的影响。在我的网站上，有两个按钮也可以在点击时上下移动相同的div，展开和折叠网站的第二部分。我通过查看Stack Overflow上的其他问题得到了这一点，但现在我被卡住了。我的问题是：第一次单击上下移动div，它工作正常。第二次，这是奇怪和跳跃。它快速向后，无需上下滚动。我在这里用jsFiddle制作了一个简化版本的网站，以防任何人修改代码。如果有人能帮助我解决这个问题，我将不胜感激！这是我的代码： var ovf, slider; $(function(){ ovf = this.getElementById(“signUp”); slider = this.getElementById(“intro”); winResize(); $(window).bind({resize: winResize, scroll: winScroll}); }); function winResize(){ ovf.style.top = slider.offse## Heading ##tHeight + “px”; } function winScroll(){ var op = 1 – ($(document).scrollTop() / slider.offsetHeight); } $(document).ready(function(){ $(“#scrollDown a”).live(‘click’,function(e){ console.log(‘test’); $(‘#signUp’).animate({ top: ‘0’, […]

Skrollr.js（followup）根据元素的窗口高度和y位置动态设置属性，但属性必须响应特定的序列: 如果您通过我的Skrollr.js在这里：当用户滚动窗口问题时，循环操作将一直发生，那么您基本上知道发生了什么。 Skrollr，我正在使用的插件，无法处理无限循环操作。所以@Prinzhorn提出的建议是使用“模数运算符”。我试过这个，你可以看到这里。然而，这也带来了另一个问题，因为你也可以看到，因为我需要一个事件发生（动画）每第N个像素滚动。但是卷轴从不会传递每一个数字; 它跳过了很多。所以，到目前为止，我无法弄清楚如何从那里获得恒定的间隔。无论如何，这个问题以及这样一个事实：即使他们正在影响的事物不在视口中，也可能总是发生一些动作（或者更确切地说，很多动作）并不是一个好主意。所以我决定尝试为我的初始Skrollr动态设置data值。这些数据值将尽我所能，根据窗口高度和内容位置等通过jQuery自行完成等等。所以，很快，我设置了这个小的JS代码（jsFiddle 1），它附加了不同的图层可以在需要添加的任何位置进行动画处理，并设置data间隔，这些图层应在视口中处理它们时的操作。但是，我还没有弄清楚如何根据下面显示的顺序让他们设置CSS值！但是当你读到这篇文章时我正在研究它！ 1 2 3 4 5 请注意，我正在谈论的序列基本上是一层应该显示在另一层之上，从而动画一，二，三，四，五 ……再回到四，三，二，一 ……再来一次等等，正如我所说，我正在努力，但我已经到了 for (i in intervals) { layer += ‘ data-‘ + (start + intervals[i]) + ‘=” “‘; } 现在我必须弄清楚如何获得一些这些data属性来定位display: block; CSS更改display: block; 和，其他， display: none; 然后，如何使这些非对称，因为他们需要响应上面的来回序列。更新否1 好的，这就是我现在要做的事情：在这里看到更新的好消息（2）。 […]

是否有可能创建一个在发布滚动条时触发的jQuery事件？: 我想知道如何创建一个jQuery事件，如果使用鼠标滚动（以及使用键盘滚动时）释放滚动标记时将触发该事件。在搜索互联网时，我发现了一个特殊的scrollstop事件，当滚动停止时会触发，但这包括滚动条仍然被保持的情况。事件可以以某种方式结合起来，所以让我们说只有当鼠标被释放时才会触发scrollstop事件？

jQuery检查元素在可滚动div中是否可见: 好的，我使用以下代码来检查元素是否在屏幕上可见。 (function($) { /** * Copyright 2012, Digital Fusion * Licensed under the MIT license. * http://teamdf.com/jquery-plugins/license/ * * @author Sam Sehnert * @desc A small plugin that checks whether elements are within * the user visible viewport of a web browser. * only accounts for vertical position, not horizontal. */ $.fn.visible = function(partial) { […]

如果窗口在chrome中放大/缩小，则滚动事件的代码不会执行: 我正在使用下面的脚本将滚动数据加载到页面底部并在所有浏览器中正常工作。但是如果我使用键盘快捷键Ctr+或Ctrl- （>或<默认缩放）手动放大/缩小窗口，它似乎不适用于chrome。 if (($(window).scrollTop() + $(window).innerHeight()) >= $(document).height()){ loadData(); }

jQuery – 分别处理同一个类的多个实例？: 目标：我正在尝试创建一个视差滚动效果。视差容器的实现方式如下：当它的容器滚动到视图中时，我需要启动视差效果。离开视图后，效果需要停止。问题：到目前为止jQuery工作得很好。但是：因为我可以在一个页面上有多个视差容器（例如一个在顶部，一个在底部），我需要它们由jQuery 独立处理。目前效果是…… 1.）一旦第一个视差容器滚动到视图中，就触发每个视差容器 2.）每个视差容器离开视野后停止。所以还不是解决方案。思考我认为它应该适用于jQuerys .each（），但到目前为止我无法真正开始工作。当我尝试实现它时，我想我在某处混淆了嵌套函数。码这是我目前的代码： $(document).ready(function(){ $.fn.is_on_screen = function(){ var win = $(window); var viewport = { top : win.scrollTop(), left : win.scrollLeft() }; viewport.right = viewport.left + win.width(); viewport.bottom = viewport.top + win.height(); var bounds = this.offset(); bounds.right […]

黑客垂直滚动到水平滚动: 我知道这违背了本书中的每一个可用性规则，但有没有人有任何想法强制垂直滚动水平滚动？因此，如果：用户正在查看页面，向下滚动，页面会水平滚动？谢谢！

如何滚动到页面的中间（50％）: 如果不使用流行的scrollTo插件，如何滚动到页面/ div的垂直中间（50％）？

Javascript：检测OS X“自然滚动”设置: 我正面临一个问题。对于我正在做的项目，我正在检测滚轮位置，并根据我正在导航到下一张幻灯片。但问题是，一些Mac用户使用“自然滚动” – 反转他们在页面上的滚动。这意味着，对于那些用户，我应该使用另一个方向的滚动作为触发器。我的问题是; 有没有办法检测用户滚动的方向？我最初的想法是跟踪滚动并查看scrollTop和scrollwheel如何相互关联（即，我记录鼠标滚轮事件并查看页面滚动的方向）。但是，这需要用户在我知道该做什么之前滚动。这不起作用，因为用户首先需要触发幻灯片更改。我很茫然。所有帮助表示赞赏。