我正在使用滚动魔术(很棒(来触发事件(.overnav(进入触发区域时。我有多个.overnavdivs,所以我使用一个.east((循环为每个实例发射。这有效,但是我还需要找到每个Div的高度并告诉滚动魔术以更新每个 unique unique 实例的 unique 持续时间。这一半有效...
下面的脚本返回每个.overnavdiv的高度,但它返回每个实例的nnavdiv高度。我不确定如何指定第一个.overnavdiv以使用第一个overnavdiv高度,第二个使用第二个。m使用每个实例的高度。该脚本仅使用 last overnav高度更新持续时间,而不是正确的。
所以我在每个循环中,并期望该循环中的每个功能都会返回该特定实例的信息。我究竟做错了什么?我相当未经训练,基本上是在这些事情中进行的灌木丛。这个让我很难过。
jQuery(document).ready(function ($) {
//Init ScrollMagic
var controller = new ScrollMagic.Controller();
//Scene 3 Loop - send .underNav objects under the sidenav
$('.overNav').each(function() {
// build a scene
var overNavScene = new ScrollMagic.Scene({
triggerHook: '.25',
reverse: true,
triggerElement: this
})
.setClassToggle("#sidenav", "fade-out")
//get height of each overnav on enter
.on("enter", function() {
$('.overNav').each(function() {
var overNavHeight = $(this).height()
overNavScene.duration(overNavHeight);
console.log(overNavHeight);
});
})
.addTo(controller);
});
});
如果这对其他任何人都有用,我想我已经弄清楚了。我需要将"此"进一步传递到嵌套函数中,因此我将其声明为变量并删除下游的每个循环。
jQuery(document).ready(function ($) {
//Init ScrollMagic
var controller = new ScrollMagic.Controller();
//Scene 3 Loop - send .underNav objects under the sidenav
var $thisss = this; // THIS was the key
$('.overNav').each(function() {
// build a scene
var overNavScene = new ScrollMagic.Scene({
triggerHook: '.25',
reverse: true,
triggerElement: $thisss
})
.setClassToggle("#sidenav", "fade-out")
//get height of each overnav on enter
.on("enter", function() {
$('.overNav').each(function() {
var overNavHeight = $($thisss).height()
overNavScene.duration(overNavHeight);
console.log(overNavHeight);
});
})
.addTo(controller);
});
});