http://www.piroc.com/delete/waypointsTest.htmlで複数のウェイポイントを使用していますが、主にスクロール中に要素をアニメーション化しています。アニメーションオブジェクトの高さが変更されると、次のウェイポイントの位置がずれてしまいます。私はrefreshAll()関数に関するすべてを読んで、適切だと思うところで使っていましたが、それは明らかに正しくありません。 また、ウィンドウのサイズを変更すると、ページ上の4つの円のアニメーションが正しい位置で機能しません。ウェイポイント(複数); refreshAll not working
は、ここに私のコード
var homeCircles = jQuery('#home-circles');
var whatWeDo = jQuery('#what-we-do');
var ourWork = jQuery('#our-work');
var caseStudies = jQuery('.case-studies');
var homeLogo = jQuery('#home-logo');
var headerLogo = jQuery('#header-logo');
//scrolling animations by way of 'waypoint' jquery plugin.
var homeLogoPos = homeLogo;
var homeLogoOffset = homeLogoPos.offset();
var waypointHeaderLogo = new Waypoint({
element: headerLogo,
offset: function() {
return -(homeLogo.height() + homeLogoOffset.top - 190)
},
handler: function(direction) {
if (direction === 'down') {
jQuery(this.element).addClass('scrolled');
} else {
jQuery(this.element).removeClass('scrolled');
}
Waypoint.refreshAll;
//tried the following as well, no luck
Waypoint.disableAll();
Waypoint.enableAll();
}
})
var waypointWhatWeDo = new Waypoint({
element: whatWeDo,
offset: '99%',
handler: function(direction) {
if (direction === 'down') {
whatWeDo.addClass('scrolled');
} else {
whatWeDo.removeClass('scrolled');
}
Waypoint.refreshAll(); //causes an error
}
})
var waypointHomeCircles = new Waypoint({
element: homeCircles,
offset: '99%',
handler: function(direction) {
if (direction === 'down') {
homeCircles.addClass('scrolled');
} else {
homeCircles.removeClass('scrolled');
}
Waypoint.refreshAll;
}
})
var waypointHomeCircles2 = new Waypoint({
element: homeCircles,
offset: '99%',
handler: function(direction) {
if (direction === 'down') {
ourWork.addClass('scrolled');
} else {
ourWork.removeClass('scrolled');
}
Waypoint.refreshAll;
}
})
var waypointsCaseStudies = new Waypoint({
element: caseStudies,
offset: '99%',
handler: function(direction) {
if (direction === 'down') {
caseStudies.addClass('scrolled');
} else {
caseStudies.removeClass('scrolled');
}
}
})
注:私は(関数括弧付き)Waypoint.refreshAll()を使用する場合、私は、スタックエラーが発生します。
refreshAll()を正しく使用する方法についての任意のポインターが正しく評価されます。