嘿伙计们我遇到了一个小问题。我正在尝试做一个演示网站,并希望制作一个元素,好像它漂浮在空中。我已经设法让这个东西工作(对于标题部分),但是当你到达元素时,它已经离开了原始位置。目前我的javascript正在计算元素和页面顶部之间的距离。
$(document).ready(function() {
$(window).scroll(function () {
$('.parallax-element-container').css({
'bottom' : -($(this).scrollTop()/8)+"px"
});
});
});
我已将问题上传到codepen以便给您一个想法,欢迎提出任何建议。
答案 0 :(得分:1)
您可以等到窗口scrollTop更靠近目标,然后开始移动它。
示例:http://codepen.io/anon/pen/aONWEP
$(document).ready(function() {
var parallaxTop = $('.parallax-element-container').offset().top;
var parallaxStart = parallaxTop * .9;
$(window).scroll(function() {
if ($(this).scrollTop() >= parallaxStart) {
$('.parallax-element-container').css({
'bottom': -(($(this).scrollTop() - parallaxStart) / 2) + "px"
});
}
});
});