下载最新版
-
+
源代码
@@ -348,7 +385,7 @@
@@ -754,6 +791,55 @@
c.appendChild(p);
}
})();
+
+ /* ── Scroll Progress Bar ── */
+ var progressBar = document.getElementById('scroll-progress');
+ window.addEventListener('scroll', function() {
+ var h = document.documentElement.scrollHeight - window.innerHeight;
+ var p = h > 0 ? (window.scrollY / h) * 100 : 0;
+ progressBar.style.width = p + '%';
+ }, { passive: true });
+
+ /* ── Mouse Parallax on Orbs ── */
+ var orb1 = document.getElementById('orb1');
+ var orb2 = document.getElementById('orb2');
+ var heroEl = document.getElementById('hero');
+ heroEl.addEventListener('mousemove', function(e) {
+ var cx = (e.clientX / window.innerWidth - 0.5) * 2;
+ var cy = (e.clientY / window.innerHeight - 0.5) * 2;
+ orb1.style.transform = 'translate(' + (cx * 30) + 'px,' + (cy * 20) + 'px)';
+ orb2.style.transform = 'translate(' + (cx * -25) + 'px,' + (cy * -15) + 'px)';
+ });
+ heroEl.addEventListener('mouseleave', function() {
+ orb1.style.transform = ''; orb2.style.transform = '';
+ });
+
+ /* ── Magnetic Buttons ── */
+ document.querySelectorAll('.btn-magnetic').forEach(function(btn) {
+ btn.addEventListener('mousemove', function(e) {
+ var r = btn.getBoundingClientRect();
+ var dx = e.clientX - (r.left + r.width / 2);
+ var dy = e.clientY - (r.top + r.height / 2);
+ btn.style.transform = 'translate(' + (dx * 0.15) + 'px,' + (dy * 0.15) + 'px)';
+ });
+ btn.addEventListener('mouseleave', function() {
+ btn.style.transform = '';
+ });
+ });
+
+ /* ── 3D Tilt on Tech & Gallery Cards ── */
+ document.querySelectorAll('.tech-card, .gallery-card, .eco-card').forEach(function(card) {
+ card.classList.add('tilt-card');
+ card.addEventListener('mousemove', function(e) {
+ var r = card.getBoundingClientRect();
+ var x = (e.clientX - r.left) / r.width - 0.5;
+ var y = (e.clientY - r.top) / r.height - 0.5;
+ card.style.transform = 'perspective(600px) rotateY(' + (x * 8) + 'deg) rotateX(' + (-y * 8) + 'deg) scale(1.02)';
+ });
+ card.addEventListener('mouseleave', function() {
+ card.style.transform = '';
+ });
+ });