parallaxLiquid.js 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. /*!
  2. Crafto - Parallax Liquid Image
  3. Created by ThemeZaa
  4. !*/
  5. ! function(n) {
  6. var t = n(window),
  7. o = t.height();
  8. t.resize(function() {
  9. o = t.height()
  10. }), n.fn.parallaxLiquidImg = function(i, scale, scaleFraction, reverse, e) {
  11. var l, r = n(this);
  12. var canScale = scale ? 1 : 0;
  13. var scale = scale ? scale : 1.2;
  14. var scaleFraction = scaleFraction ? scaleFraction : 0.001;
  15. var lastScrollPos = 0;
  16. var scrollDir = '';
  17. const { animate } = anime;
  18. function u() {
  19. var e = t.scrollTop();
  20. r.each(function() {
  21. var t = n(this),
  22. u = t.offset().top,
  23. tHeight = t.outerHeight(),
  24. uOffesetBottom = u + tHeight;
  25. if(e > lastScrollPos) {
  26. scrollDir = 'forward';
  27. } else{
  28. scrollDir = 'reverse';
  29. }
  30. lastScrollPos = e;
  31. if (u < n(window).height()+e && uOffesetBottom > e) {
  32. if (scrollDir == 'forward') {
  33. scale = scale + scaleFraction;
  34. } else {
  35. scale = scale - scaleFraction;
  36. }
  37. }
  38. if (reverse) {
  39. if (t.attr('data-parallax-scale')) {
  40. u + l(t) < e || u > e + o || (
  41. n(window).width() > 1050
  42. ? (animate(r[0],{translateY: i / 6 * (u - e) + "px", scale: canScale ? scale : 1}))
  43. : r.css("transform", "translateY(0px)")
  44. )
  45. } else {
  46. u + l(t) < e || u > e + o || (
  47. n(window).width() > 1050
  48. ? (animate(r[0],{translateY: i / 20 * -(u - e) + "px", scale: canScale ? scale : 1}))
  49. : r.css("transform", "translateY(0px)")
  50. )
  51. }
  52. } else {
  53. if (t.attr('data-parallax-scale')) {
  54. u + l(t) < e || u > e + o || (
  55. n(window).width() > 1050
  56. ? (animate(r[0],{ translateY: i / 6 * -(u - e) + "px", scale: canScale ? scale : 1}))
  57. : r.css("transform", "translateY(0px)")
  58. )
  59. } else {
  60. u + l(t) < e || u > e + o || (
  61. n(window).width() > 1050
  62. ? (animate(r[0],{translateY: i / 20 * (u - e) + "px", scale: canScale ? scale : 1}))
  63. : r.css("transform", "translateY(0px)")
  64. )
  65. }
  66. }
  67. })
  68. }(arguments.length < 1 || null === i) && (i = 1), (arguments.length < 2 || null === e) && (e = !0), l = e ? function(n) {
  69. return n.outerHeight(!0)
  70. } : function(n) {
  71. return n.height()
  72. }, t.bind("scroll", u).resize(u), u()
  73. }
  74. }(jQuery);