lizixuan/webs
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

更改所有页面中英文切换样式及JS功能代码 所有页面logo图片不切换

Browse Source
This commit is contained in:
yaoqin
2025-05-08 17:04:34 +08:00
parent 3923e4df10
commit 602ee741e0
17 changed files with 1443 additions and 583 deletions
Download Patch File Download Diff File Expand all files Collapse all files

708
hanJing/js/index.js
View File

@@ -43,345 +43,429 @@ document.addEventListener('DOMContentLoaded', () => {
observer.observe(element);
});
// ------------------------------
// 获取所需的DOM元素
const container = document.querySelector('.carousel-container');
const list = document.querySelector('.carousel-list');
const items = document.querySelectorAll('.carousel-item');
const prevBtn = document.querySelector('.carousel-arrow-left');
const nextBtn = document.querySelector('.carousel-arrow-right');
const indicators = document.querySelectorAll('.indicator');
// ------------------------------
// 获取所需的DOM元素
const container = document.querySelector('.carousel-container');
const list = document.querySelector('.carousel-list');
const items = document.querySelectorAll('.carousel-item');
const prevBtn = document.querySelector('.carousel-arrow-left');
const nextBtn = document.querySelector('.carousel-arrow-right');
const indicators = document.querySelectorAll('.indicator');
// 如果元素不存在，直接返回
if (!container || !list || !items.length) {
console.error('轮播图元素不存在，初始化失败');
return;
}
// 克隆第一个和最后一个项目
const firstClone = items[0].cloneNode(true);
const lastClone = items[items.length - 1].cloneNode(true);
// 将克隆的元素添加到列表中
list.appendChild(firstClone);
list.insertBefore(lastClone, list.firstChild);
// 设置初始位置，因为添加了一个项目在前面，所以从1开始
let currentIndex = 1;
let interval = null;
let isTransitioning = false;
// 初始化位置
updatePosition(false);
// 更新位置的函数
function updatePosition(withTransition = true) {
// 如果需要过渡动画
if (withTransition) {
list.style.transition = 'transform 0.5s ease';
} else {
list.style.transition = 'none';
// 如果元素不存在，直接返回
if (!container || !list || !items.length) {
console.error('轮播图元素不存在，初始化失败');
return;
}
// 计算位置并应用变换
const position = -currentIndex * 100;
list.style.transform = `translateX(${position}%)`;
// 更新指示器状态，注意要减去1因为我们添加了克隆项目
updateIndicators();
}
// 更新指示器状态
function updateIndicators() {
// 考虑循环，将currentIndex转换回真实索引
const realIndex = currentIndex - 1;
// 使用模运算确保索引在有效范围内
const activeIndex = (realIndex + items.length) % items.length;
indicators.forEach((indicator, i) => {
indicator.classList.toggle('active', i === activeIndex);
});
}
// 克隆第一个和最后一个项目
const firstClone = items[0].cloneNode(true);
const lastClone = items[items.length - 1].cloneNode(true);
// 自动播放函数
function startAutoPlay() {
if (interval) clearInterval(interval);
interval = setInterval(nextSlide, 3000);
}
// 将克隆的元素添加到列表中
list.appendChild(firstClone);
list.insertBefore(lastClone, list.firstChild);
// 暂停自动播放
function stopAutoPlay() {
clearInterval(interval);
}
// 设置初始位置，因为添加了一个项目在前面，所以从1开始
let currentIndex = 1;
let interval = null;
let isTransitioning = false;
// 下一张函数
function nextSlide() {
if (isTransitioning) return;
isTransitioning = true;
currentIndex++;
updatePosition();
}
// 初始化位置
updatePosition(false);
// 上一张函数
function prevSlide() {
if (isTransitioning) return;
isTransitioning = true;
currentIndex--;
updatePosition();
}
// 处理过渡结束事件
list.addEventListener('transitionend', () => {
isTransitioning = false;
// 如果到达了最后一个克隆项
if (currentIndex >= items.length + 1) {
currentIndex = 1;
updatePosition(false);
// 更新位置的函数
function updatePosition(withTransition = true) {
// 如果需要过渡动画
if (withTransition) {
list.style.transition = 'transform 0.5s ease';
} else {
list.style.transition = 'none';
}
// 计算位置并应用变换
const position = -currentIndex * 100;
list.style.transform = `translateX(${position}%)`;
// 更新指示器状态，注意要减去1因为我们添加了克隆项目
updateIndicators();
}
// 如果到达了第一个克隆项
if (currentIndex <= 0) {
currentIndex = items.length;
updatePosition(false);
// 更新指示器状态
function updateIndicators() {
// 考虑循环，将currentIndex转换回真实索引
const realIndex = currentIndex - 1;
// 使用模运算确保索引在有效范围内
const activeIndex = (realIndex + items.length) % items.length;
indicators.forEach((indicator, i) => {
indicator.classList.toggle('active', i === activeIndex);
});
}
});
// // 绑定按钮事件
// prevBtn.addEventListener('click', () => {
// prevSlide();
// stopAutoPlay();
// startAutoPlay();
// });
// 自动播放函数
function startAutoPlay() {
if (interval) clearInterval(interval);
interval = setInterval(nextSlide, 3000);
}
// nextBtn.addEventListener('click', () => {
// nextSlide();
// stopAutoPlay();
// startAutoPlay();
// });
// 暂停自动播放
function stopAutoPlay() {
clearInterval(interval);
}
// 绑定指示器点击事件
indicators.forEach((indicator, index) => {
indicator.addEventListener('click', () => {
currentIndex = index + 1; // +1因为我们添加了克隆项目
// 下一张函数
function nextSlide() {
if (isTransitioning) return;
isTransitioning = true;
currentIndex++;
updatePosition();
}
// 上一张函数
function prevSlide() {
if (isTransitioning) return;
isTransitioning = true;
currentIndex--;
updatePosition();
}
// 处理过渡结束事件
list.addEventListener('transitionend', () => {
isTransitioning = false;
// 如果到达了最后一个克隆项
if (currentIndex >= items.length + 1) {
currentIndex = 1;
updatePosition(false);
}
// 如果到达了第一个克隆项
if (currentIndex <= 0) {
currentIndex = items.length;
updatePosition(false);
}
});
// 绑定指示器点击事件
indicators.forEach((indicator, index) => {
indicator.addEventListener('click', () => {
currentIndex = index + 1; // +1因为我们添加了克隆项目
updatePosition();
stopAutoPlay();
startAutoPlay();
});
});
// 鼠标悬停暂停
container.addEventListener('mouseenter', stopAutoPlay);
container.addEventListener('mouseleave', startAutoPlay);
// 添加触摸滑动支持
let touchStartX = 0;
let touchEndX = 0;
container.addEventListener('touchstart', (e) => {
touchStartX = e.touches[0].clientX;
stopAutoPlay();
});
container.addEventListener('touchend', (e) => {
touchEndX = e.changedTouches[0].clientX;
const difference = touchStartX - touchEndX;
if (Math.abs(difference) > 50) {
if (difference > 0) {
nextSlide();
} else {
prevSlide();
}
}
startAutoPlay();
});
});
// 鼠标悬停暂停
container.addEventListener('mouseenter', stopAutoPlay);
container.addEventListener('mouseleave', startAutoPlay);
// 添加触摸滑动支持
let touchStartX = 0;
let touchEndX = 0;
container.addEventListener('touchstart', (e) => {
touchStartX = e.touches[0].clientX;
stopAutoPlay();
});
container.addEventListener('touchend', (e) => {
touchEndX = e.changedTouches[0].clientX;
const difference = touchStartX - touchEndX;
if (Math.abs(difference) > 50) {
if (difference > 0) {
nextSlide();
} else {
prevSlide();
}
}
// 开始自动播放
startAutoPlay();
});
// 开始自动播放
startAutoPlay();
// --------------------------------
// --------------------------------
const langData = {
zh: {
nav: {
home: "首页",
business: "主营业务",
products: "产品案例",
support: "技术支持",
future: "展望未来",
about: "关于我们"
const langData = {
zh: {
nav: {
home: "首页",
business: "主营业务",
products: "产品案例",
support: "技术支持",
future: "展望未来",
about: "关于我们"
},
btn: "English",
logo: "./imgs/svg/logo.svg",
bannerBg: "../imgs/svg/背景纹（大）.svg",
bannerListImgs: [
"../imgs/home/mainBusiness.png",
"../imgs/home/aboutUs.png",
],
CarouselImgs: [
"./imgs/home/Y100.jpg",
"./imgs/home/S6PRO.jpg",
],
carouselText: "产品详情",
title: "深圳汉晶电子信息有限公司",
bannerBottom2Title: "为什么选择汉晶?",
bannerBottomListOneTitle: "IC设计全生命周期一站式覆盖",
bannerBottomListTwoTitle: "独特的低功耗设计，让芯片更有竞争力",
bannerBottomListThreeTitle: "有稳定的芯片制造商合作关系",
bannerBottomListFourTitle: "流片均一版成功，即流片成功率100%,助力客户赢得市场",
bannertopTitle: "芯片设计技术服务",
bannertopText: "我们公司提供全方位的芯片设计技术服务，涵盖从需求讨论、系统设计、逻辑设计、FPGA原型验证到最终的芯片制造、测试与验证等各个环节。我们采用行业领先的工具和技术，确保芯片的性能、功耗、稳定性都能满足客户需求。",
bannerletfTextTitle: "Y100 服务器芯片",
bannerletfTextTitle2: "S6PRO 运算加速芯片",
bannerBottomTextTitle: "我们的目标",
bannerBottomTextText: "汇聚人才，共同创造突破性技术，为更加智能、更加安全、更有保障的科技世界保驾护航。",
newBottomTitle: "研发团队",
newBottomText: "研究生学历",
emailLeftTitle: "我们准备好了",
emailLeftText: "如果您有更多的需求，请联系我们",
},
btn: "English",
logo: "./imgs/svg/logo.svg",
bannerBg: "../imgs/svg/背景纹（大）.svg",
bannerListImgs: [
"../imgs/home/mainBusiness.png",
"../imgs/home/aboutUs.png",
],
CarouselImgs: [
"./imgs/home/Y100.jpg",
"./imgs/home/S6PRO.jpg",
],
carouselText: "产品详情",
title: "深圳汉晶电子信息有限公司",
bannerBottom2Title: "为什么选择汉晶?",
bannerBottomListOneTitle: "IC设计全生命周期一站式覆盖",
bannerBottomListTwoTitle: "独特的低功耗设计，让芯片更有竞争力",
bannerBottomListThreeTitle: "有稳定的芯片制造商合作关系",
bannerBottomListFourTitle: "流片均一版成功，即流片成功率100%,助力客户赢得市场",
bannertopTitle: "芯片设计技术服务",
bannertopText: "我们公司提供全方位的芯片设计技术服务，涵盖从需求讨论、系统设计、逻辑设计、FPGA原型验证到最终的芯片制造、测试与验证等各个环节。我们采用行业领先的工具和技术，确保芯片的性能、功耗、稳定性都能满足客户需求。",
bannerletfTextTitle: "Y100 服务器芯片",
bannerletfTextTitle2: "S6PRO 运算加速芯片",
bannerBottomTextTitle: "我们的目标",
bannerBottomTextText: "汇聚人才，共同创造突破性技术，为更加智能、更加安全、更有保障的科技世界保驾护航。",
newBottomTitle: "研发团队",
newBottomText: "研究生学历",
emailLeftTitle: "我们准备好了",
emailLeftText: "如果您有更多的需求，请联系我们",
en: {
nav: {
home: "Home",
business: "Business",
products: "Products",
support: "Support",
future: "Future",
about: "About Us"
},
btn: "简体中文",
logo: "./imgs/svg/logo_en.svg",
bannerBg: "../imgs/svg/bg_en.svg",
bannerListImgs: [
"../imgs/home/mainBusiness_en.png",
"../imgs/home/aboutUs_en.png",
],
CarouselImgs: [
"./imgs/home/Y100_en.jpg",
"./imgs/home/S6PRO_en.jpg",
],
carouselText: "Product Details",
title: "SZHJ Electronic Information Co., Ltd",
bannerBottom2Title: "Why Hanjing?",
bannerBottomListOneTitle: "One-stop coverage of the entire IC design life cycle",
bannerBottomListTwoTitle: "Unique low-power design makes the chip more competitive",
bannerBottomListThreeTitle: "Stable relationships with chip makers",
bannerBottomListFourTitle: "Successful flow of the first version of the film, i.e., 100% success rate of the flow of the film, to help customers win the market",
bannertopTitle: "Chip Design Technology Services",
bannertopText: "Our company provides a full range of chip design technology services, covering all aspects from requirements discussion, system design, logic design, FPGA prototyping, to final chip manufacturing, testing and verification. We use industry-leading tools and technologies to ensure that the performance, power consumption, and stability of the chip meets customer requirements.",
bannerletfTextTitle: "Y100 Server Chips",
bannerletfTextTitle2: "S6PRO computing accelerator chip",
bannerBottomTextTitle: "Our Goals",
bannerBottomTextText: "Bringing together talents to create breakthrough technologies for a smarter, safer and more secure technological world.",
newBottomTitle: "R&D Team",
newBottomText: "postgraduate education",
emailLeftTitle: "We're ready.",
emailLeftText: "If you have more needs, please contact us!",
}
};
// 语言显示更新函数 - 移到外部作为独立函数
function updateLanguageDisplay(lang) {
const currentFlag = document.getElementById('current-flag');
const currentLangText = document.getElementById('current-lang');
},
en: {
nav: {
home: "Home",
business: "Business",
products: "Products",
support: "Support",
future: "Future",
about: "About Us"
},
btn: "简体中文",
logo: "./imgs/svg/logo_en.svg",
bannerBg: "../imgs/svg/bg_en.svg",
bannerListImgs: [
"../imgs/home/mainBusiness_en.png",
"../imgs/home/aboutUs_en.png",
],
CarouselImgs: [
"./imgs/home/Y100_en.jpg",
"./imgs/home/S6PRO_en.jpg",
],
carouselText: "Product Details",
title: "SZHJ Electronic Information Co., Ltd",
bannerBottom2Title: "Why Hanjing?",
bannerBottomListOneTitle: "One-stop coverage of the entire IC design life cycle",
bannerBottomListTwoTitle: "Unique low-power design makes the chip more competitive",
bannerBottomListThreeTitle: "Stable relationships with chip makers",
bannerBottomListFourTitle: "Successful flow of the first version of the film, i.e., 100% success rate of the flow of the film, to help customers win the market",
bannertopTitle: "Chip Design Technology Services",
bannertopText: "Our company provides a full range of chip design technology services, covering all aspects from requirements discussion, system design, logic design, FPGA prototyping, to final chip manufacturing, testing and verification. We use industry-leading tools and technologies to ensure that the performance, power consumption, and stability of the chip meets customer requirements.",
bannerletfTextTitle: "Y100 Server Chips",
bannerletfTextTitle2: "S6PRO computing accelerator chip",
bannerBottomTextTitle: "Our Goals",
bannerBottomTextText: "Bringing together talents to create breakthrough technologies for a smarter, safer and more secure technological world.",
newBottomTitle: "R&D Team",
newBottomText: "postgraduate education",
emailLeftTitle: "We're ready.",
emailLeftText: "If you have more needs, please contact us!",
}
};
let currentLang = localStorage.getItem('siteLang') || "zh";
function applyLang(lang) {
const data = langData[lang];
// 导航文本
document.getElementById("nav-home").textContent = data.nav.home;
document.getElementById("nav-business").textContent = data.nav.business;
document.getElementById("nav-products").textContent = data.nav.products;
document.getElementById("nav-support").textContent = data.nav.support;
document.getElementById("nav-future").textContent = data.nav.future;
document.getElementById("nav-about").textContent = data.nav.about;
// 按钮文本
document.getElementById("lang-toggle").textContent = data.btn;
// logo
document.getElementById("logo-img").src = data.logo;
document.getElementById("footerLogo").src = data.logo;
// 轮播图图片全部替换（包括克隆节点）
document.querySelectorAll('img[alt="S6PRO"]').forEach(img => {
img.src = data.CarouselImgs[1];
});
document.querySelectorAll('img[alt="Y100"]').forEach(img => {
img.src = data.CarouselImgs[0];
});
// 轮播图详情按钮文本全部切换
document.querySelectorAll('.carouselText').forEach(span => {
span.textContent = data.carouselText;
});
// 其它页面内容
document.querySelector('.bannerBottom2Title').textContent = data.bannerBottom2Title;
document.querySelector('.bannerBottomListOneTitle').textContent = data.bannerBottomListOneTitle;
document.querySelector('.bannerBottomListTwoTitle').textContent = data.bannerBottomListTwoTitle;
document.querySelector('.bannerBottomListThreeTitle').textContent = data.bannerBottomListThreeTitle;
document.querySelector('.bannerBottomListFourTitle').textContent = data.bannerBottomListFourTitle;
document.querySelector('.bannertopTitle').textContent = data.bannertopTitle;
document.querySelector('.bannertopText').textContent = data.bannertopText;
document.querySelector('.bannerletfTextTitle').textContent = data.bannerletfTextTitle;
document.querySelector('.bannerBottomTextTitle').textContent = data.bannerBottomTextTitle;
document.querySelector('.bannerBottomTextText').textContent = data.bannerBottomTextText;
document.querySelector('.newBottomTitle').textContent = data.newBottomTitle;
document.querySelector('.newBottomText').textContent = data.newBottomText;
document.querySelector('.emailLeftTitle').textContent = data.emailLeftTitle;
document.querySelector('.emailLeftText').textContent = data.emailLeftText;
document.querySelector('.footerBoxRightTitle').textContent = data.title;
document.querySelector('.title').textContent = data.title;
document.getElementById("bannerletfTextTitle2").textContent = data.bannerletfTextTitle2;
if (lang === 'en') {
document.querySelector('.textBox').classList.add('en');
} else {
document.querySelector('.textBox').classList.remove('en');
if (currentFlag && currentLangText) {
if (lang === 'en') {
currentFlag.src = './imgs/flags/en.svg';
currentLangText.textContent = 'English';
} else {
currentFlag.src = './imgs/flags/zh.svg';
currentLangText.textContent = '简体中文';
}
}
}
let currentLang = localStorage.getItem('siteLang') || "zh";
function applyLang(lang) {
try {
const data = langData[lang];
// 导航文本 - 使用常规的条件检查而不是可选链
const navHome = document.getElementById("nav-home");
if (navHome) navHome.textContent = data.nav.home;
const navBusiness = document.getElementById("nav-business");
if (navBusiness) navBusiness.textContent = data.nav.business;
const navProducts = document.getElementById("nav-products");
if (navProducts) navProducts.textContent = data.nav.products;
const navSupport = document.getElementById("nav-support");
if (navSupport) navSupport.textContent = data.nav.support;
const navFuture = document.getElementById("nav-future");
if (navFuture) navFuture.textContent = data.nav.future;
const navAbout = document.getElementById("nav-about");
if (navAbout) navAbout.textContent = data.nav.about;
// logo
// const logoImg = document.getElementById("logo-img");
// if (logoImg) logoImg.src = data.logo;
// const footerLogo = document.getElementById("footerLogo");
// if (footerLogo) footerLogo.src = data.logo;
// 轮播图图片全部替换（包括克隆节点）
document.querySelectorAll('img[alt="S6PRO"]').forEach(img => {
img.src = data.CarouselImgs[1];
});
document.querySelectorAll('img[alt="Y100"]').forEach(img => {
img.src = data.CarouselImgs[0];
});
// 轮播图详情按钮文本全部切换
document.querySelectorAll('.carouselText').forEach(span => {
span.textContent = data.carouselText;
});
// 其它页面内容 - 单独处理每个元素
const bannerBottom2Title = document.querySelector('.bannerBottom2Title');
if (bannerBottom2Title) bannerBottom2Title.textContent = data.bannerBottom2Title;
const bannerBottomListOneTitle = document.querySelector('.bannerBottomListOneTitle');
if (bannerBottomListOneTitle) bannerBottomListOneTitle.textContent = data.bannerBottomListOneTitle;
const bannerBottomListTwoTitle = document.querySelector('.bannerBottomListTwoTitle');
if (bannerBottomListTwoTitle) bannerBottomListTwoTitle.textContent = data.bannerBottomListTwoTitle;
const bannerBottomListThreeTitle = document.querySelector('.bannerBottomListThreeTitle');
if (bannerBottomListThreeTitle) bannerBottomListThreeTitle.textContent = data.bannerBottomListThreeTitle;
const bannerBottomListFourTitle = document.querySelector('.bannerBottomListFourTitle');
if (bannerBottomListFourTitle) bannerBottomListFourTitle.textContent = data.bannerBottomListFourTitle;
const bannertopTitle = document.querySelector('.bannertopTitle');
if (bannertopTitle) bannertopTitle.textContent = data.bannertopTitle;
const bannertopText = document.querySelector('.bannertopText');
if (bannertopText) bannertopText.textContent = data.bannertopText;
const bannerletfTextTitle = document.querySelector('.bannerletfTextTitle');
if (bannerletfTextTitle) bannerletfTextTitle.textContent = data.bannerletfTextTitle;
const bannerBottomTextTitle = document.querySelector('.bannerBottomTextTitle');
if (bannerBottomTextTitle) bannerBottomTextTitle.textContent = data.bannerBottomTextTitle;
const bannerBottomTextText = document.querySelector('.bannerBottomTextText');
if (bannerBottomTextText) bannerBottomTextText.textContent = data.bannerBottomTextText;
const newBottomTitle = document.querySelector('.newBottomTitle');
if (newBottomTitle) newBottomTitle.textContent = data.newBottomTitle;
const newBottomText = document.querySelector('.newBottomText');
if (newBottomText) newBottomText.textContent = data.newBottomText;
const emailLeftTitle = document.querySelector('.emailLeftTitle');
if (emailLeftTitle) emailLeftTitle.textContent = data.emailLeftTitle;
const emailLeftText = document.querySelector('.emailLeftText');
if (emailLeftText) emailLeftText.textContent = data.emailLeftText;
// 页面标题
document.title = data.title;
const footerTitle = document.querySelector('.footerBoxRightTitle');
if (footerTitle) footerTitle.textContent = data.title;
const titleElement = document.querySelector('.title');
if (titleElement) titleElement.textContent = data.title;
const bannerletfTextTitle2 = document.getElementById("bannerletfTextTitle2");
if (bannerletfTextTitle2) bannerletfTextTitle2.textContent = data.bannerletfTextTitle2;
// 特定类的添加/移除
const textBox = document.querySelector('.textBox');
if (textBox) {
if (lang === 'en') {
textBox.classList.add('en');
} else {
textBox.classList.remove('en');
}
}
// bannerBottomList 背景图片
const bannerTop = document.querySelector(".bannertop");
if (bannerTop && data.bannerListImgs[0]) {
bannerTop.style.backgroundImage = `url(${data.bannerListImgs[0]})`;
}
const bannerBottom = document.querySelector(".bannerBottom");
if (bannerBottom && data.bannerListImgs[1]) {
bannerBottom.style.backgroundImage = `url(${data.bannerListImgs[1]})`;
}
} catch (error) {
console.error("语言切换出错:", error);
}
}
// bannerBottomList 背景图片
const bannerListClasses = [
".bannertop",
".bannerBottom",
];
bannerListClasses.forEach((cls, idx) => {
const el = document.querySelector(cls);
if (el) {
el.style.backgroundImage = `url(${data.bannerListImgs[idx]})`;
function handleLangToggle(lang) {
currentLang = lang;
localStorage.setItem('siteLang', currentLang);
applyLang(currentLang);
updateLanguageDisplay(currentLang);
// 如果在aboutUs页面，还需要更新地图信息
if (typeof updateMapInfo === 'function') {
updateMapInfo(currentLang);
}
}
// 初始化语言
applyLang(currentLang);
updateLanguageDisplay(currentLang);
// 获取语言切换相关的DOM元素
const langBtn = document.getElementById('lang-btn');
const langDropdown = document.getElementById('lang-dropdown');
const langItems = document.querySelectorAll('.lang-item');
// 切换下拉菜单显示/隐藏
langBtn?.addEventListener('click', function(e) {
e.stopPropagation(); // 阻止事件冒泡
langDropdown.classList.toggle('show');
const arrow = langBtn.querySelector('.arrow');
if (arrow) {
arrow.style.transform = langDropdown.classList.contains('show') ? 'rotate(180deg)' : 'rotate(0)';
}
});
}
function handleLangToggle() {
currentLang = currentLang === "zh" ? "en" : "zh";
localStorage.setItem('siteLang', currentLang);
applyLang(currentLang);
}
// 初始化
applyLang(currentLang);
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
});
});
// 点击其他区域关闭下拉菜单
document.addEventListener('click', function(event) {
if (!event.target.closest('.lang-dropdown') && langDropdown) {
langDropdown.classList.remove('show');
const arrow = langBtn?.querySelector('.arrow');
if (arrow) {
arrow.style.transform = 'rotate(0)';
}
}
});
// 语言选择事件
langItems?.forEach(item => {
item.addEventListener('click', function() {
const lang = this.getAttribute('data-lang');
if (lang !== currentLang) {
handleLangToggle(lang);
}
langDropdown.classList.remove('show');
const arrow = langBtn.querySelector('.arrow');
if (arrow) {
arrow.style.transform = 'rotate(0)';
}
});
});
});