更改所有页面中英文切换样式及JS功能代码 所有页面logo图片不切换
This commit is contained in:
@@ -149,7 +149,7 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
product_item_titleVV10:"VV10 Information Security Chip",
|
||||
OtherProducts:"Other Products",
|
||||
detail_info_textY1001:"Solution: We designed a chip that integrates high-speed computing, signal processing unit and data transmission functions through an in-depth study of customer requirements.",
|
||||
detail_info_textY1002:"Technology highlights: Customized 22nm process with low power design.",
|
||||
detail_info_textY1002:"Technical highlight: Adopting customized 22nm process and low-power design.",
|
||||
detail_info_textS6PRO1:"Solution: Further optimize the details based on the architecture of the S1PRO chip, reduce logic resources and save area.",
|
||||
detail_info_textS6PRO2:"Technical highlights: it uses a customized 12nm process, integrates multiple core modules, and improves AI computing power with a self-developed AI algorithm acceleration module.",
|
||||
detail_info_textS1PRO1:"Solution: We designed a system-on-chip with integrated soc and specific acceleration modules according to the customer's requirements. The advanced architecture and specific low-power design ensure that the chip is balanced in terms of performance and power consumption.",
|
||||
@@ -162,107 +162,190 @@ document.addEventListener('DOMContentLoaded', function() {
|
||||
detail_info_textGSEC82:"Technical Highlights: Supports state secret algorithms with CC EAL5+ certification and TRNG.",
|
||||
emailLeftTitle:"We're ready.",
|
||||
emailLeftText:"If you have more needs, please contact us!",
|
||||
|
||||
|
||||
|
||||
}
|
||||
};
|
||||
|
||||
|
||||
|
||||
let currentLang = localStorage.getItem('siteLang') || "zh";
|
||||
|
||||
// 语言显示更新函数
|
||||
function updateLanguageDisplay(lang) {
|
||||
const currentFlag = document.getElementById('current-flag');
|
||||
const currentLangText = document.getElementById('current-lang');
|
||||
|
||||
if (currentFlag && currentLangText) {
|
||||
if (lang === 'en') {
|
||||
currentFlag.src = '../imgs/flags/en.svg';
|
||||
currentLangText.textContent = 'English';
|
||||
} else {
|
||||
currentFlag.src = '../imgs/flags/zh.svg';
|
||||
currentLangText.textContent = '简体中文';
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
function applyLang(lang) {
|
||||
const data = langData[lang];
|
||||
|
||||
|
||||
|
||||
|
||||
// logo
|
||||
document.getElementById("footerLogo").src = data.logo;
|
||||
|
||||
|
||||
|
||||
// 检查元素是否存在,然后再设置
|
||||
// // logo
|
||||
// const footerLogo = document.getElementById("footerLogo");
|
||||
// if (footerLogo) footerLogo.src = data.logo;
|
||||
|
||||
// 页面内容
|
||||
document.getElementById("title").textContent = data.title;
|
||||
document.getElementById("topBannerLeftTitle1").textContent = data.topBannerLeftTitle1;
|
||||
document.getElementById("topBannerLeftTitle2").textContent = data.topBannerLeftTitle2;
|
||||
document.querySelector(".topBannerBthSpan").textContent = data.topBannerBthSpan;
|
||||
const titleElement = document.getElementById("title");
|
||||
if (titleElement) titleElement.textContent = data.title;
|
||||
|
||||
const topBannerLeftTitle1 = document.getElementById("topBannerLeftTitle1");
|
||||
if (topBannerLeftTitle1) topBannerLeftTitle1.textContent = data.topBannerLeftTitle1;
|
||||
|
||||
const topBannerLeftTitle2 = document.getElementById("topBannerLeftTitle2");
|
||||
if (topBannerLeftTitle2) topBannerLeftTitle2.textContent = data.topBannerLeftTitle2;
|
||||
|
||||
const topBannerBthSpan = document.querySelector(".topBannerBthSpan");
|
||||
if (topBannerBthSpan) topBannerBthSpan.textContent = data.topBannerBthSpan;
|
||||
|
||||
// 使用querySelectorAll获取所有元素并检查每个元素
|
||||
document.querySelectorAll('.product_item_titleY100').forEach(el => {
|
||||
el.textContent = data.product_item_titleY100;
|
||||
if (el) el.textContent = data.product_item_titleY100;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.product_item_titleS6PRO').forEach(el => {
|
||||
el.textContent = data.product_item_titleS6PRO;
|
||||
if (el) el.textContent = data.product_item_titleS6PRO;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.product_item_titleFX100').forEach(el => {
|
||||
el.textContent = data.product_item_titleFX100;
|
||||
if (el) el.textContent = data.product_item_titleFX100;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.product_item_titleGSEC8').forEach(el => {
|
||||
el.textContent = data.product_item_titleGSEC8;
|
||||
if (el) el.textContent = data.product_item_titleGSEC8;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.product_item_titleS1PRO').forEach(el => {
|
||||
el.textContent = data.product_item_titleS1PRO;
|
||||
if (el) el.textContent = data.product_item_titleS1PRO;
|
||||
});
|
||||
|
||||
document.querySelectorAll('.product_item_titleVV10').forEach(el => {
|
||||
el.textContent = data.product_item_titleVV10;
|
||||
if (el) el.textContent = data.product_item_titleVV10;
|
||||
});
|
||||
|
||||
const otherProducts = document.querySelector(".OtherProducts");
|
||||
if (otherProducts) otherProducts.textContent = data.OtherProducts;
|
||||
|
||||
// 解决方案和技术亮点文本
|
||||
const elements = {
|
||||
".detail_info_textY1001": data.detail_info_textY1001,
|
||||
".detail_info_textY1002": data.detail_info_textY1002,
|
||||
".detail_info_textS6PRO1": data.detail_info_textS6PRO1,
|
||||
".detail_info_textS6PRO2": data.detail_info_textS6PRO2,
|
||||
".detail_info_textS1PRO1": data.detail_info_textS1PRO1,
|
||||
".detail_info_textS1PRO2": data.detail_info_textS1PRO2,
|
||||
".detail_info_textVV101": data.detail_info_textVV101,
|
||||
".detail_info_textVV102": data.detail_info_textVV102,
|
||||
".detail_info_textFX1001": data.detail_info_textFX1001,
|
||||
".detail_info_textFX1002": data.detail_info_textFX1002,
|
||||
".detail_info_textGSEC81": data.detail_info_textGSEC81,
|
||||
".detail_info_textGSEC82": data.detail_info_textGSEC82,
|
||||
".emailLeftTitle": data.emailLeftTitle,
|
||||
".emailLeftText": data.emailLeftText,
|
||||
};
|
||||
|
||||
document.querySelector(".OtherProducts").textContent = data.OtherProducts;
|
||||
document.querySelector(".detail_info_textY1001").textContent = data.detail_info_textY1001;
|
||||
document.querySelector(".detail_info_textY1002").textContent = data.detail_info_textY1002;
|
||||
document.querySelector(".detail_info_textS6PRO1").textContent = data.detail_info_textS6PRO1;
|
||||
document.querySelector(".detail_info_textS6PRO2").textContent = data.detail_info_textS6PRO2;
|
||||
document.querySelector(".detail_info_textS1PRO1").textContent = data.detail_info_textS1PRO1;
|
||||
document.querySelector(".detail_info_textS1PRO2").textContent = data.detail_info_textS1PRO2;
|
||||
document.querySelector(".detail_info_textVV101").textContent = data.detail_info_textVV101;
|
||||
document.querySelector(".detail_info_textVV102").textContent = data.detail_info_textVV102;
|
||||
document.querySelector(".detail_info_textFX1001").textContent = data.detail_info_textFX1001;
|
||||
document.querySelector(".detail_info_textFX1002").textContent = data.detail_info_textFX1002;
|
||||
document.querySelector(".detail_info_textGSEC81").textContent = data.detail_info_textGSEC81;
|
||||
document.querySelector(".detail_info_textGSEC82").textContent = data.detail_info_textGSEC82;
|
||||
document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
|
||||
document.querySelector(".emailLeftText").textContent = data.emailLeftText;
|
||||
document.querySelector('.footerBoxRightTitle').textContent = data.title;
|
||||
// 遍历并应用文本
|
||||
for (const [selector, text] of Object.entries(elements)) {
|
||||
const element = document.querySelector(selector);
|
||||
if (element) element.textContent = text;
|
||||
}
|
||||
|
||||
const footerBoxRightTitle = document.querySelector('.footerBoxRightTitle');
|
||||
if (footerBoxRightTitle) footerBoxRightTitle.textContent = data.title;
|
||||
|
||||
// 切换样式
|
||||
if (lang === 'en') {
|
||||
document.getElementById('topBannerLeftTitle1').classList.add('en');
|
||||
document.getElementById('topBannerLeftTitle2').classList.add('en');
|
||||
} else {
|
||||
document.getElementById('topBannerLeftTitle1').classList.remove('en');
|
||||
document.getElementById('topBannerLeftTitle2').classList.remove('en');
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 切换样式
|
||||
if (lang === 'en') {
|
||||
if (topBannerLeftTitle1) topBannerLeftTitle1.classList.add('en');
|
||||
if (topBannerLeftTitle2) topBannerLeftTitle2.classList.add('en');
|
||||
} else {
|
||||
if (topBannerLeftTitle1) topBannerLeftTitle1.classList.remove('en');
|
||||
if (topBannerLeftTitle2) topBannerLeftTitle2.classList.remove('en');
|
||||
}
|
||||
|
||||
// 更新语言显示
|
||||
updateLanguageDisplay(lang);
|
||||
}
|
||||
|
||||
function handleLangToggle() {
|
||||
currentLang = currentLang === "zh" ? "en" : "zh";
|
||||
// 修正的handleLangToggle函数,正确接收lang参数
|
||||
function handleLangToggle(lang) {
|
||||
currentLang = lang;
|
||||
localStorage.setItem('siteLang', currentLang);
|
||||
applyLang(currentLang);
|
||||
updateLanguageDisplay(currentLang);
|
||||
}
|
||||
// 初始化
|
||||
|
||||
// 初始化
|
||||
applyLang(currentLang);
|
||||
|
||||
|
||||
// 事件绑定
|
||||
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
|
||||
document.getElementById("lang-toggle").addEventListener("keydown", e => {
|
||||
if (e.key === "Enter" || e.key === " ") handleLangToggle();
|
||||
});
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
updateLanguageDisplay(currentLang);
|
||||
|
||||
// 获取语言切换相关的DOM元素
|
||||
const langBtn = document.getElementById('lang-btn');
|
||||
const langDropdown = document.getElementById('lang-dropdown');
|
||||
const langItems = document.querySelectorAll('.lang-item');
|
||||
|
||||
// 切换下拉菜单显示/隐藏
|
||||
if (langBtn) {
|
||||
langBtn.addEventListener('click', function(e) {
|
||||
console.log(`点击切换语言`);
|
||||
e.stopPropagation(); // 阻止事件冒泡
|
||||
|
||||
// 直接修改样式,而不是依赖 CSS 类
|
||||
if (langDropdown.style.display === 'block') {
|
||||
langDropdown.style.display = 'none';
|
||||
} else {
|
||||
langDropdown.style.display = 'block';
|
||||
// 确保绝对定位和 z-index 正确设置
|
||||
langDropdown.style.position = 'absolute';
|
||||
langDropdown.style.top = '100%';
|
||||
langDropdown.style.right = '0';
|
||||
langDropdown.style.zIndex = '1000';
|
||||
}
|
||||
|
||||
// 旋转箭头
|
||||
const arrow = langBtn.querySelector('.arrow');
|
||||
if (arrow) {
|
||||
arrow.style.transform = langDropdown.style.display === 'block' ? 'rotate(180deg)' : 'rotate(0)';
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 点击其他区域关闭下拉菜单
|
||||
document.addEventListener('click', function(event) {
|
||||
if (!event.target.closest('.lang-dropdown') && langDropdown) {
|
||||
langDropdown.style.display = 'none';
|
||||
const arrow = langBtn?.querySelector('.arrow');
|
||||
if (arrow) {
|
||||
arrow.style.transform = 'rotate(0)';
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// 语言选择事件
|
||||
if (langItems) {
|
||||
langItems.forEach(item => {
|
||||
item.addEventListener('click', function() {
|
||||
const lang = this.getAttribute('data-lang');
|
||||
if (lang !== currentLang) {
|
||||
handleLangToggle(lang);
|
||||
}
|
||||
if (langDropdown) langDropdown.style.display = 'none';
|
||||
const arrow = langBtn?.querySelector('.arrow');
|
||||
if (arrow) {
|
||||
arrow.style.transform = 'rotate(0)';
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
|
||||
// 注释掉旧的事件绑定代码,避免错误
|
||||
// document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
|
||||
// document.getElementById("lang-toggle").addEventListener("keydown", e => {
|
||||
// if (e.key === "Enter" || e.key === " ") handleLangToggle();
|
||||
// });
|
||||
});
|
||||
Reference in New Issue
Block a user