使元素滚动更慢(Parrallax) [英] Make element scroll slower (Parrallax)

查看:75
本文介绍了使元素滚动更慢(Parrallax)的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的页面上有一个元素绝对定位。

I have an element on my page absolutely positioned.

我试图编写一个jQuery片段,使该元素以比页面上其他元素更慢的速度滚动。

Im trying to write a snippet of jQuery to make that element scroll at a slower rate than the rest of the elements on the page.

到目前为止我写过这篇文章,但似乎根本无法完成任务。有没有人有这方面的经验,你是否愿意解释?

I've written this so far but cannot seem to get it too work at all. Has anybody experience with this and if so would you care explaining?

$(document).ready(function() {
    $window = $(window);
    $('.twit-bird').css({
        'top' : -($('window')/3)+"px"
     });
}); 






我还尝试添加一个锚,在我的窗口顶部有一个固定的div来计算出没有运气的计算结果......


I've also tried to add an anchor, a fixed div at the top of my window to work out the calcs from that with no luck...

也尝试过这个

$(document).ready(function() {
// Cache the Window object
 windowScroll = $(this).scrollTop();

 $(window).scroll(function() {
    $('.twit-bird').css({
        'top' : -(windowScroll/3)+"px"
    });
 });
}); 


推荐答案

我可以指出你正确的方向。每次滚动窗口时都需要 $('。twit-bird')。css()来调用。你也忘记了 .scrollTop(),并且不引用窗口(或者,更好的只是使用)...

I can point you in the right direction. You need your $('.twit-bird').css() to get called every time the window is scrolled. Also you forgot .scrollTop(), and don't quote window (or, even better just use this) ...

$(window).scroll(function () { 

   $('.twit-bird').css({
      'top' : -($(this).scrollTop()/3)+"px"
   }); 

});

这篇关于使元素滚动更慢(Parrallax)的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆