Skip to content

Instantly share code, notes, and snippets.

@agragregra

agragregra/parallax-translate3d.js

Last active September 20, 2022 19:23
Show Gist options
  • Save agragregra/893f46449625f1156e78 to your computer and use it in GitHub Desktop.
Save agragregra/893f46449625f1156e78 to your computer and use it in GitHub Desktop.
Download ZIP
Smooth Parallax Scroll
Raw
parallax-translate3d.js
$(window).scroll(function() {
var st = $(this).scrollTop() /10;
$(".object").css({
"transform" : "translate3d(0px, " + st + "%, .01px)",
"-webkit-transform" : "translate3d(0px, " + st + "%, .01px)"
});
});
Copy link

ghost commented Apr 16, 2015

Круто!

@sealucky7
Copy link

Спасибо! Очень много полезного и реально классно рассказываешь! 5 баллов. У меня тока вопрос, сейчас вот делал параллакс эффект на хроме, у меня почему-то текст прыгает, при скроле, как буд-то рывками. Подскажи плиз, что это может быть? Я даже пробовал код, который указан выше...

@agragregra
Copy link
Author

sealucky7, я бы посоветовал апгрейдить аппарат.

@p-osypov
Copy link

sealucky7, у меня похожая проблема была. Я просто отключил свойство transition у обьекта)))

@WebKieth
Copy link

WebKieth commented Apr 15, 2018 •
edited
Loading

@sealucky7 @agragregra аппаратец не при чём. нет requestAnimationFrame и как минимум надо округлять получаемый st до toFixed(2)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment