Question

在我正在进行的项目中，我想要在滚动时让不同的元素淡入淡出。我将元素的不透明度定义为f(x)=a ( x - d ) ^ 2 + e，其中不透明度为f(x)，x为$(window).scrollTop ()。 e将是>=1 元素应该在轻微重叠之后逐渐淡入和淡出，因此对于每个元素，抛物线必须沿x轴进一步移动。

var alpha = -0.000009 * ((Math.pow($(window).scrollTop () + delta),  2)) + 1;
$('#content').css({'opacity':alpha});

这将是滚动触发的功能的一部分。这适用于元素＃1，但对于以下元素，我必须更改delta。有没有办法为每个元素定义不同的值？或者我是否必须为每个人手动更改它？我希望尽可能简单。

Answer 1

有没有办法为每个元素定义不同的值？

是的，您可以在每个元素上使用属性data-delta，并将其作为函数的一部分读取

<div id="content" data-delta="1.23">Content here</div>

在给定元素引用

的情况下使用.data("delta")读取它

var $elem = $('#content');
var delta = $elem.data("delta");
var alpha = -0.000009 * ((Math.pow($(window).scrollTop () + delta),  2)) + 1;
$elem.css({'opacity':alpha});

为每个语句重新定义一个值？

1 个答案: