Advertisement
Guest User

Untitled

a guest
Jul 7th, 2015
189
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.23 KB | None | 0 0
  1. define(
  2. [
  3. 'jquery'
  4. ], function ($) {
  5.  
  6. var heroElements = $('.js-hero-scrolling');
  7.  
  8. var ticking = false;
  9. var lastScrollY = $(window).scrollTop();
  10.  
  11. function onResize() {
  12. updateElements();
  13. lastScrollY = $(window).scrollTop();
  14. }
  15.  
  16. function onScroll(evt) {
  17.  
  18. if (!ticking) {
  19. ticking = true;
  20. requestAnimFrame(updateElements);
  21. lastScrollY = $(window).scrollTop();
  22. }
  23. }
  24.  
  25. function updateElements() {
  26.  
  27. if (heroElements !== null) {
  28. heroElements.each(function (){
  29.  
  30. var heroHeight = $(this).height() + parseInt($(this).css('padding-top').replace(/[^-\d\.]/g, '')) + parseInt($(this).css('padding-bottom').replace(/[^-\d\.]/g, ''));
  31.  
  32. if( lastScrollY > 0 && lastScrollY <= (heroHeight / 2)){
  33. var pos = parseInt(lastScrollY * 100 / (heroHeight / 2) );
  34. $(this).css('background-position', '50% ' + pos + "%");
  35. }else {
  36. if(lastScrollY > (heroHeight / 2)){
  37. $(this).css('background-position', '50% 100%');
  38. }else {
  39. $(this).css('background-position', '50% 0');
  40. }
  41. }
  42.  
  43. });
  44. }
  45.  
  46. ticking = false;
  47. }
  48.  
  49. // shim layer with setTimeout fallback
  50. window.requestAnimFrame = (function() {
  51. return window.requestAnimationFrame ||
  52. window.webkitRequestAnimationFrame ||
  53. window.mozRequestAnimationFrame ||
  54. window.oRequestAnimationFrame ||
  55. window.msRequestAnimationFrame ||
  56. function(callback) {
  57. window.setTimeout(callback, 1000 / 60);
  58. };
  59. })();
  60.  
  61.  
  62. function initScroll() {
  63. updateElements();
  64. lastScrollY = $(window).scrollTop();
  65. }
  66.  
  67. window.addEventListener('resize', onResize, false);
  68. window.addEventListener('scroll', onScroll, false);
  69.  
  70.  
  71. return {
  72. init: initScroll
  73. }
  74. });
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement