https://www.victorhardware.com/template/en/js/alpha.js

1let MW = document.querySelector('.MainWrapper');
2let damp = 0.05;
3const scrollbarMain = Scrollbar.init(MW, {
4	damping: damp,
5	renderByPixels: false,
6});
7
8//获取滚动位置
9var ScrollOffset = 0;
10
11function GetOffset() {
12	requestAnimationFrame(GetOffset);
13	if (Scrollbar.has(MW)) {
14		ScrollOffset = Scrollbar.get(MW).offset.y;
15	} else(
16		ScrollOffset = MW.scrollTop
17	)
18
19}
20GetOffset();
21
22let winW = $(window).innerWidth();
23
24//参数项：目标，水平位移X，垂直位移Y，缩放Scale
25if (winW > 769) {
26	Parallax_elmV(".LandingBanner>div", 0, 0.85, 0);
27	Parallax_elmV(".LandingBanner .iBG", 0, 0, 0.2);
28	Parallax_elmV(".abImg", 0, -0.3, 0);
29	Parallax_elmV(".abImg>div", 0, 0.5, -0.15);
30	Parallax_elmV(".PdImg1c>div", 0, 0.1, -0.25);
31	Parallax_elmV(".PdImg2", 0, -0.15, 0);
32	Parallax_elmV(".PdImg2>div", 0, 0.15, -0.15);
33	Parallax_elmV(".sConceptBgc>div", 0, 0.85, -0.125);
34	Parallax_elmV(".NewsImg", 0, -0.15, 0);
35	Parallax_elmV(".NewsImg>div", 0, 0.1, -0.2);
36	Parallax_elmV(".sConEE", 0, 0.2, 0);
37	Parallax_elmV(".xianImg", 2, 0, 0);
38	Parallax_elmV(".advImg", 0, -0.3, 0.2);
39	Parallax_elmV(".eleImg", 0, -0.3, 0.3);
40	Parallax_elmV(".fooBox", 0, .45, 0);
41	Parallax_elmV(".aboutBox", 0, .6, 0);
42}
43
44
45function Parallax_elmV(elm, hz, vz, sz) {
46	let e = $(elm);
47	e.each(function () {
48		let $this = $(this);
49		//let $offset = $this.offset().top;
50		let $offset = $this.parents('[data-parallax]').eq(0).offset().top; //父元素作定位基准
51		console.log($offset)
52
53		function sc_parallax_animate() {
54			requestAnimationFrame(sc_parallax_animate);
55			$offset = $this.parents('[data-parallax]').eq(0).offset().top;
56			let winH = $(window).innerHeight();
57			//let $height = $this.outerHeight();
58			let $height = $this.parents('[data-parallax]').eq(0).outerHeight();
59			let $int_position = 0 - ($offset + $height / 2 - winH / 2); //元素中点相对屏幕中心位置
60			let $transform = Math.round($int_position);
61			if ($transform * sz < 0 && $transform > 0) {
62				sz1 = 0
63			} else {
64				sz1 = sz
65			};
66			if (ScrollOffset > -1) {
67				//$this.css("transform", `perspective(1000px) translate3d(${(Math.round($transform * hz))}px, ${(Math.round($transform * vz))}px, ${(Math.round($transform * sz1))}px)`)
68				$this.css("transform", `perspective(1000px) translate3d(${($transform * hz)}px, ${($transform * vz)}px, ${($transform * sz1)}px)`)
69			} else {
70				//$this.css("transform", `perspective(1000px) translate3d(0px, 0px, 0px)`)
71			}
72		}
73		sc_parallax_animate();
74	})
75}