103 lines
2.8 KiB
JavaScript
103 lines
2.8 KiB
JavaScript
// 主要功能脚本
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
// 更新页面标题
|
||
document.title = '企业名称 - 数字化企业服务领导者';
|
||
|
||
// 图片加载优化
|
||
function lazyLoadImages() {
|
||
const images = document.querySelectorAll('img');
|
||
|
||
if ('IntersectionObserver' in window) {
|
||
const imageObserver = new IntersectionObserver((entries, observer) => {
|
||
entries.forEach(entry => {
|
||
if (entry.isIntersecting) {
|
||
const image = entry.target;
|
||
// 如果图片有data-src属性，则将其加载
|
||
if (image.dataset.src) {
|
||
image.src = image.dataset.src;
|
||
image.removeAttribute('data-src');
|
||
}
|
||
imageObserver.unobserve(image);
|
||
}
|
||
});
|
||
});
|
||
|
||
images.forEach(image => {
|
||
imageObserver.observe(image);
|
||
});
|
||
}
|
||
}
|
||
|
||
// 滚动到顶部按钮
|
||
function createScrollTopButton() {
|
||
const scrollBtn = document.createElement('button');
|
||
scrollBtn.innerHTML = '↑';
|
||
scrollBtn.className = 'scroll-top-btn';
|
||
scrollBtn.style.cssText = `
|
||
position: fixed;
|
||
bottom: 20px;
|
||
right: 20px;
|
||
width: 40px;
|
||
height: 40px;
|
||
border-radius: 50%;
|
||
background-color: #2F558C;
|
||
color: white;
|
||
border: none;
|
||
display: none;
|
||
align-items: center;
|
||
justify-content: center;
|
||
font-size: 20px;
|
||
cursor: pointer;
|
||
z-index: 999;
|
||
box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
|
||
`;
|
||
|
||
document.body.appendChild(scrollBtn);
|
||
|
||
// 显示/隐藏按钮
|
||
window.addEventListener('scroll', () => {
|
||
if (window.scrollY > 300) {
|
||
scrollBtn.style.display = 'flex';
|
||
} else {
|
||
scrollBtn.style.display = 'none';
|
||
}
|
||
});
|
||
|
||
// 点击按钮滚动到顶部
|
||
scrollBtn.addEventListener('click', () => {
|
||
window.scrollTo({
|
||
top: 0,
|
||
behavior: 'smooth'
|
||
});
|
||
});
|
||
}
|
||
|
||
// 平滑滚动到锚点
|
||
function setupSmoothScrolling() {
|
||
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
|
||
anchor.addEventListener('click', function(e) {
|
||
const href = this.getAttribute('href');
|
||
|
||
if (href !== '#') {
|
||
e.preventDefault();
|
||
|
||
const targetElement = document.querySelector(href);
|
||
if (targetElement) {
|
||
const headerHeight = document.querySelector('.header').offsetHeight;
|
||
const targetPosition = targetElement.getBoundingClientRect().top + window.pageYOffset - headerHeight;
|
||
|
||
window.scrollTo({
|
||
top: targetPosition,
|
||
behavior: 'smooth'
|
||
});
|
||
}
|
||
}
|
||
});
|
||
});
|
||
}
|
||
|
||
// 执行所有初始化功能
|
||
lazyLoadImages();
|
||
createScrollTopButton();
|
||
setupSmoothScrolling();
|
||
}); |