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

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

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
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

87
hanJing/css/header.css
View File

@ -115,3 +115,90 @@
color: #fff;
text-shadow: 0 0 10px rgba(41, 111, 216, 0.5);
}
/* -------------------- */
/* 语言切换下拉框样式 */
.lang-dropdown {
position: relative;
display: inline-block;
cursor: pointer;
margin-bottom: 2vh;
margin-left: 8px;
}
.lang-btn {
display: flex;
align-items: center;
background-color: transparent;
color: #ffffff;
border: none;
cursor: pointer;
padding: 8px 12px;
border-radius: 4px;
font-size: 0.8vw;
transition: all 0.3s ease;
font-weight: 600;
}
.lang-btn:hover {
background-color: rgba(255, 255, 255, 0.1);
}
.lang-btn img {
width: 20px;
height: 14px;
margin-right: 8px;
border-radius: 2px;
object-fit: cover;
}
.lang-btn .arrow {
margin-left: 8px;
transition: transform 0.3s ease;
}
.lang-dropdown-content {
display: none;
position: absolute;
right: 0;
top: 100%; /* 确保设置了这个值 */
min-width: 120px;
background-color: #ffffff;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
border-radius: 4px;
z-index: 1000;
overflow: hidden;
}
.lang-dropdown-content.show {
display: block;
animation: fadeIn 0.2s ease;
}
.lang-item {
display: flex;
align-items: center;
padding: 10px 12px;
color: #333;
text-decoration: none;
transition: all 0.2s ease;
}
.lang-item:hover {
background-color: #f5f5f5;
}
.lang-item img {
width: 20px;
height: 14px;
margin-right: 8px;
border-radius: 2px;
object-fit: cover;
}
@keyframes fadeIn {
from { opacity: 0; transform: translateY(-10px); }
to { opacity: 1; transform: translateY(0); }
}

24
hanJing/html/aboutUs.html
View File

@ -34,7 +34,29 @@
<li> <a id="nav-future" href="./approaching.html"> 展望未来</a></li>
<li> <a id="nav-about" class="actives" href="#" style="color: #fff;"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="../imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="../imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="../imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">

25
hanJing/html/approaching.html
View File

@ -26,7 +26,28 @@
<li> <a id="nav-future" class="actives" href="#" style="color: #fff;"> 展望未来</a></li>
<li> <a id="nav-about" href="./aboutUs.html"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="../imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="../imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="../imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">
@ -78,7 +99,7 @@
</div>
</li>
<li>
<img class="futureImg" src="../imgs/approaching/6g.png" alt="低功耗量子计算芯片">
<img class="futureImg" src="../imgs/approaching/future.png" alt="低功耗量子计算芯片">
<div class="futureContent">
<p>面向量产的工程化突破</p>
<p>设计出功耗性能更优秀的定制化计算芯片。</p>

24
hanJing/html/mainBusiness.html
View File

@ -26,7 +26,29 @@
<li> <a id="nav-future" href="./approaching.html"> 展望未来</a></li>
<li> <a id="nav-about" href="./aboutUs.html"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="../imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="../imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="../imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">

23
hanJing/html/ourProducts.html
View File

@ -26,7 +26,28 @@
<li> <a id="nav-future" href="./approaching.html"> 展望未来</a></li>
<li> <a id="nav-about" href="./aboutUs.html"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="../imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="../imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="../imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">

24
hanJing/html/technicalSupport.html
View File

@ -16,7 +16,7 @@
<header class="header">
<div class="container">
<div class="logo">
<img id="logo-img" src="./imgs/svg/logo.svg" alt="logo">
<img id="logo-img" src="../imgs/svg/logo.svg" alt="logo">
</div>
<ul>
<li> <a id="nav-home" href="../index.html"> 首页</a></li>
@ -26,7 +26,27 @@
<li> <a id="nav-future" href="./approaching.html"> 展望未来</a></li>
<li> <a id="nav-about" href="./aboutUs.html"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="../imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="../imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="../imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">

BIN
hanJing/imgs/approaching/future.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 261 KiB

1
hanJing/imgs/flags/en.svg Normal file
View File

File diff suppressed because one or more lines are too long
Side by Side

After

Width:  |  Height:  |  Size: 7.2 KiB

1
hanJing/imgs/flags/zh.svg Normal file
View File

@ -0,0 +1 @@
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1746690536424" class="icon" viewBox="0 0 1536 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="7258" xmlns:xlink="http://www.w3.org/1999/xlink" width="300" height="200"><path d="M0 0h1536v1024H0z" fill="#D8231D" p-id="7259"></path><path d="M626.7392 261.5808a165.4784 165.4784 0 0 1 14.3872 14.0288l14.2848 15.0016 36.608-17.664a163.84 163.84 0 0 1-8.96 18.432c-3.072 6.0416-6.2976 11.9808-9.5232 18.176l28.8768 30.0032a25.6 25.6 0 0 1-3.072 0l-34.9184-6.5536c-3.3792-0.6144-3.3792-0.512-5.12 2.6112l-16.1792 30.72-1.9456 3.2256-1.2288-8.2944c-1.536-10.24-2.9184-20.48-4.3008-30.72-0.4096-2.4576-0.4096-2.5088-2.9184-3.0208l-35.84-6.5536a5.12 5.12 0 0 1-1.8432-0.7168c5.9904-3.3792 12.1344-6.144 18.176-9.1136l18.5344-8.9088-5.12-40.3968zM502.016 170.6496l0.6144-0.512 37.3248 15.36 26.7264-31.6416v4.3008l-2.304 33.9456c0 3.3792 0 3.3792 2.9184 4.608l32.7168 13.2096c0.768 0 1.3824 0.6144 2.7136 1.1776l-3.072 1.0752-34.56 8.448c-2.9184 0.6144-2.9184 0.6144-3.1744 3.6864l-2.4576 37.0176-0.3072 1.8432-2.0992-3.2256c-6.144-9.8304-12.288-19.712-18.5856-29.5424-1.6896-2.7648-1.792-2.7648-5.12-1.8944l-34.2016 8.3456-2.9184 0.5632c9.0624-10.9056 17.8176-21.1968 26.7264-31.7952l-21.0432-34.6112z m-63.488 144.0768L357.5808 374.4768l-1.9968 1.4848c-2.304 1.792-2.304 1.792-1.3824 4.6592l22.1184 67.584 10.24 31.4368 0.768 2.5088h-0.6144l-1.792-1.2288-86.016-62.976-0.768-0.4608h-0.7168L209.0496 482.4576l-0.6144-0.4608 33.5872-105.0112-88.4736-64.3584v-0.768h105.3184c4.608 0 3.84 0.5632 5.12-3.84l32.256-96.2048a9.472 9.472 0 0 1 1.6896-3.2768l33.536 103.2704c6.0416 0.3072 12.1344 0 18.1248 0h91.4432v0.6656z m161.2288 253.9008l-34.2528 8.2944-3.2256 0.9216-2.816 41.6768-1.9968-2.816-18.7392-29.7984c-1.792-2.816-1.8432-2.816-5.12-2.048l-34.1504 8.448-3.072 0.512 26.7776-31.8464-21.0432-34.56 0.4096-0.512c6.3488 2.1504 12.4416 5.12 18.688 7.424l18.8928 7.68 26.2144-31.1296h0.512v3.4816l-2.304 33.8432v1.2288a2.56 2.56 0 0 0 1.9968 3.1744l14.1312 5.6832 19.6608 7.8848 2.7136 1.1264-3.2256 1.0752z m99.1744-122.4704l-27.0336 21.0432c-2.6624 2.048-2.6624 2.048-1.536 5.12l11.6736 32.6144a6.4512 6.4512 0 0 1 0.3584 3.2256l-33.792-23.3984-32.4608 25.1904-0.512-0.4096 11.4176-39.4752-33.4848-23.04v-0.768c13.4144-0.6656 26.88-0.512 40.704-1.28l11.8272-38.8096h0.512l1.2288 3.072 11.52 32.3584c1.024 2.9184 1.024 2.9184 4.096 2.816l34.2528-1.024h3.2256v0.6144z" fill="#FFFA30" p-id="7260"></path></svg>
Side by Side

After

Width:  |  Height:  |  Size: 2.5 KiB

22
hanJing/index.html
View File

@ -26,7 +26,27 @@
<li> <a id="nav-future" href="./html/approaching.html"> 展望未来</a></li>
<li> <a id="nav-about" href="./html/aboutUs.html"> 关于我们</a></li>
</ul>
<button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button>
<!-- <button class="language" id="lang-toggle" aria-label="切换语言" tabindex="0">English</button> -->
<div class="lang-dropdown">
<button class="lang-btn" id="lang-btn" aria-label="选择语言" tabindex="0">
<img id="current-flag" src="./imgs/flags/zh.svg" alt="中文">
<span id="current-lang">简体中文</span>
<span class="arrow">▼</span>
</button>
<div class="lang-dropdown-content" id="lang-dropdown">
<div class="lang-item" data-lang="zh">
<img src="./imgs/flags/zh.svg" alt="中文">
<span>简体中文</span>
</div>
<div class="lang-item" data-lang="en">
<img src="./imgs/flags/en.svg" alt="English">
<span>English</span>
</div>
</div>
</div>
</div>
<!-- <div class="bg">
<img src="./imgs/svg/点纹.svg" alt="背景">

210
hanJing/js/aboutUs.js
View File

@ -7,12 +7,17 @@ let infoWindow = null;
const mapData = {
address: {
zh: '广东省深圳市南山区粤海街道麻岭社区麻雀岭工业区M-6栋中钢大厦5A010',
en: '5A010, Zhonggang Building, M-6 Building, Maque Ridge Industrial Zone, Ma Ling Community, Yuehai Street, Nanshan District, Shenzhen, Guangdong Province'
en: 'A010, 5th Floor, Zhonggang Building, Block M-6, Maqueling Industrial Zone, Maling Community, Yuehai Street, Nanshan District, Shenzhen, Guangdong Province, China'
},
companyName: {
zh: '深圳汉晶电子信息有限公司',
en: 'Shenzhen Hanjing Electronic Information Co., Ltd'
},
phone:{
zh: '13420976989',
en: '+86 13420976989'
},
contactInfo: {
zh: {
address: '地址',
@ -36,7 +41,7 @@ function createInfoWindowContent(lang) {
<strong>${mapData.contactInfo[lang].address}：</strong>${mapData.address[lang]}
</p>
<p style="margin: 0 0 8px 0; font-size: 13px; color: #100B4E;">
<strong>${mapData.contactInfo[lang].phone}：</strong>13420976989
<strong>${mapData.contactInfo[lang].phone}：</strong>${mapData.phone[lang]}
</p>
<p style="margin: 0; font-size: 13px; color: #100B4E;">
<strong>${mapData.contactInfo[lang].email}：</strong>fu.bin@hjsilicon.com
@ -64,6 +69,9 @@ function updateMapInfo(lang) {
// 初始化地图
function initAMap() {
try {
// 获取当前语言
const currentLang = window.currentLang || localStorage.getItem('siteLang') || "zh";
// 先加载所需插件
AMap.plugin(['AMap.Geocoder', 'AMap.ToolBar', 'AMap.Scale'], function() {
const geocoder = new AMap.Geocoder({
@ -88,7 +96,7 @@ function initAMap() {
// 创建标记
marker = new AMap.Marker({
position: [lnglat.lng, lnglat.lat],
title: mapData.companyName[window.currentLang],
title: mapData.companyName[currentLang],
animation: 'AMAP_ANIMATION_DROP',
offset: new AMap.Pixel(-13, -30)
});
@ -97,7 +105,7 @@ function initAMap() {
// 创建信息窗体
infoWindow = new AMap.InfoWindow({
content: createInfoWindowContent(window.currentLang),
content: createInfoWindowContent(currentLang),
offset: new AMap.Pixel(0, -30),
closeWhenClickMap: true
});
@ -129,26 +137,26 @@ function initAMap() {
});
} else {
console.error('地址解析失败:', result);
document.getElementById('mapContainer').innerHTML =
const mapContainer = document.getElementById('mapContainer');
if (mapContainer) {
mapContainer.innerHTML =
'<div style="text-align:center;padding:20px;color:#f00;">地址定位失败，请刷新重试</div>';
}
}
});
});
} catch (error) {
console.error('地图初始化失败:', error);
document.getElementById('mapContainer').innerHTML =
const mapContainer = document.getElementById('mapContainer');
if (mapContainer) {
mapContainer.innerHTML =
'<div style="text-align:center;padding:20px;color:#f00;">地图加载失败，请刷新重试</div>';
}
}
}
// DOM加载完成时初始化
document.addEventListener('DOMContentLoaded', function() {
if (typeof AMap !== 'undefined') {
initAMap();
}
const langData = {
zh: {
btn: "English",
@ -167,7 +175,6 @@ document.addEventListener('DOMContentLoaded', function() {
emailLeftTitle: "我们准备好了",
emailLeftText: "如果您有更多的需求，请联系我们",
bannertopBG: "../imgs/us/corporateCultureConcept.svg",
},
en: {
btn: "简体中文",
@ -186,7 +193,6 @@ document.addEventListener('DOMContentLoaded', function() {
emailLeftTitle: "We're ready.",
emailLeftText: "If you have more needs, please contact us!",
bannertopBG: "../imgs/us/corporateCultureConcept_en.svg",
}
};
@ -195,90 +201,184 @@ document.addEventListener('DOMContentLoaded', function() {
window.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("logo-img").src = data.logo;
document.getElementById("footerLogo").src = data.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.title = data.title;
document.querySelector(".footerBoxRightTitle").textContent = data.title;
const footerBoxRightTitle = document.querySelector(".footerBoxRightTitle");
if (footerBoxRightTitle) footerBoxRightTitle.textContent = data.title;
// 顶部标题和描述
document.querySelector('.topBannerLeftTitle p:nth-child(1)').textContent = data.topBannerTitle;
document.querySelector('.topBannerLeftTitle p:nth-child(2)').textContent = data.topBannerDesc;
const topBannerTitle = document.querySelector('.topBannerLeftTitle p:nth-child(1)');
if (topBannerTitle) topBannerTitle.textContent = data.topBannerTitle;
const topBannerDesc = document.querySelector('.topBannerLeftTitle p:nth-child(2)');
if (topBannerDesc) topBannerDesc.textContent = data.topBannerDesc;
// 愿景
document.querySelector('.textOne .Right p:nth-child(1)').textContent = data.visionTitle;
document.querySelector('.textOne .Right p:nth-child(2)').textContent = data.visionDesc;
const visionTitle = document.querySelector('.textOne .Right p:nth-child(1)');
if (visionTitle) visionTitle.textContent = data.visionTitle;
const visionDesc = document.querySelector('.textOne .Right p:nth-child(2)');
if (visionDesc) visionDesc.textContent = data.visionDesc;
// 使命
document.querySelector('.textTwo .Right p:nth-child(1)').textContent = data.missionTitle;
document.querySelector('.textTwo .Right p:nth-child(2)').textContent = data.missionDesc;
const missionTitle = document.querySelector('.textTwo .Right p:nth-child(1)');
if (missionTitle) missionTitle.textContent = data.missionTitle;
const missionDesc = document.querySelector('.textTwo .Right p:nth-child(2)');
if (missionDesc) missionDesc.textContent = data.missionDesc;
// 价值观
document.querySelector('.textThree .Right p:nth-child(1)').textContent = data.valueTitle;
document.querySelector('.textThree .Right p:nth-child(2)').textContent = data.valueDesc;
const valueTitle = document.querySelector('.textThree .Right p:nth-child(1)');
if (valueTitle) valueTitle.textContent = data.valueTitle;
const valueDesc = document.querySelector('.textThree .Right p:nth-child(2)');
if (valueDesc) valueDesc.textContent = data.valueDesc;
// 邮箱区
document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
document.querySelector(".emailLeftText").textContent = data.emailLeftText;
const emailLeftTitle = document.querySelector(".emailLeftTitle");
if (emailLeftTitle) emailLeftTitle.textContent = data.emailLeftTitle;
// 按钮文本
document.getElementById("lang-toggle").textContent = data.btn;
document.querySelector('.bannertop').style.backgroundImage = `url(${data.bannertopBG})`;
const emailLeftText = document.querySelector(".emailLeftText");
if (emailLeftText) emailLeftText.textContent = data.emailLeftText;
// 英文样式调整（如有需要可扩展）
// 背景图片
const bannertop = document.querySelector('.bannertop');
if (bannertop) bannertop.style.backgroundImage = `url(${data.bannertopBG})`;
// 英文样式调整
const visionPs = document.querySelectorAll('.textOne .Right p');
const missionPs = document.querySelectorAll('.textTwo .Right p');
const valuePs = document.querySelectorAll('.textThree .Right p');
if (visionPs && missionPs && valuePs) {
const allPs = [...visionPs, ...missionPs, ...valuePs];
if (lang === 'en') {
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.add('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.add('en');
if (topBannerTitle) topBannerTitle.classList.add('en');
if (topBannerDesc) topBannerDesc.classList.add('en');
allPs.forEach(p => p.classList.add('en'));
} else {
if (topBannerTitle) topBannerTitle.classList.remove('en');
if (topBannerDesc) topBannerDesc.classList.remove('en');
allPs.forEach(p => p.classList.remove('en'));
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.remove('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.remove('en');
}
}
// 更新地图信息
updateMapInfo(lang);
// 更新语言显示
updateLanguageDisplay(lang);
}
// 语言切换处理函数
function handleLangToggle() {
window.currentLang = window.currentLang === "zh" ? "en" : "zh";
// 修正的handleLangToggle函数，正确接收lang参数
function handleLangToggle(lang) {
window.currentLang = lang;
localStorage.setItem('siteLang', window.currentLang);
applyLang(window.currentLang);
updateMapInfo(window.currentLang);
updateLanguageDisplay(window.currentLang);
}
// 初始化
// 初始化语言和地图
applyLang(window.currentLang);
updateLanguageDisplay(window.currentLang);
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
if (typeof AMap !== 'undefined') {
initAMap();
}
// 获取语言切换相关的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 !== window.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();
// });
});
// 回调函数
window.initMap = function() {

128
hanJing/js/approaching.js
View File

@ -64,19 +64,39 @@ document.addEventListener('DOMContentLoaded', function () {
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;
// const footerLogo = document.getElementById("footerLogo");
// if (footerLogo) footerLogo.src = data.logo;
// 页面标题
document.title = data.title;
// 顶部标题
document.querySelector('.topBannerLeftTitle p').textContent = data.topBannerTitle;
document.querySelector('.footerBoxRightTitle').textContent = data.title;
const topBannerTitle = document.querySelector('.topBannerLeftTitle p');
if (topBannerTitle) topBannerTitle.textContent = data.topBannerTitle;
const footerBoxRightTitle = document.querySelector('.footerBoxRightTitle');
if (footerBoxRightTitle) footerBoxRightTitle.textContent = data.title;
// 列表内容
const futureList = document.querySelectorAll('.futureList > li');
data.futureList.forEach((item, idx) => {
@ -84,50 +104,120 @@ document.addEventListener('DOMContentLoaded', function () {
// 图片alt
const img = futureList[idx].querySelector('.futureImg');
if (img) img.alt = item.imgAlt;
// 标题
// 标题和描述
const ps = futureList[idx].querySelectorAll('.futureContent p');
if (ps[0]) ps[0].textContent = item.title;
if (ps[1]) ps[1].textContent = item.desc;
// 圆圈
const circle = futureList[idx].querySelector('.futureCircleInner');
if (circle) circle.textContent = item.circle;
}
});
// 英文样式切换
const futureList2 = document.querySelector('.futureList');
if (futureList2) {
if (lang === 'en') {
futureList2.classList.add('en');
} else {
futureList2.classList.remove('en');
}
}
// 邮箱区
document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
document.querySelector(".emailLeftText").textContent = data.emailLeftText;
const emailLeftTitle = document.querySelector(".emailLeftTitle");
if (emailLeftTitle) emailLeftTitle.textContent = data.emailLeftTitle;
// 按钮文本
document.getElementById("lang-toggle").textContent = data.btn;
const emailLeftText = document.querySelector(".emailLeftText");
if (emailLeftText) emailLeftText.textContent = data.emailLeftText;
// 英文样式调整（如有需要可扩展）
// 英文样式调整
if (lang === 'en') {
document.querySelector('.topBannerLeftTitle p').classList.add('en');
if (topBannerTitle) topBannerTitle.classList.add('en');
} else {
document.querySelector('.topBannerLeftTitle p').classList.remove('en');
}
if (topBannerTitle) topBannerTitle.classList.remove('en');
}
function handleLangToggle() {
currentLang = currentLang === "zh" ? "en" : "zh";
// 更新语言显示
updateLanguageDisplay(lang);
}
// 修正的handleLangToggle函数，正确接收lang参数
function handleLangToggle(lang) {
currentLang = lang;
localStorage.setItem('siteLang', currentLang);
applyLang(currentLang);
updateLanguageDisplay(currentLang);
}
// 初始化
applyLang(currentLang);
updateLanguageDisplay(currentLang);
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
// 获取语言切换相关的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();
// });
});

143
hanJing/js/header.js
View File

@ -25,31 +25,136 @@ const headerLangData = {
}
};
let currentLang = localStorage.getItem('siteLang') || "zh";
// 语言显示更新函数
function updateHeaderLanguageDisplay(lang) {
const currentFlag = document.getElementById('current-flag');
const currentLangText = document.getElementById('current-lang');
const handleHeaderLangToggle = () => {
currentLang = currentLang === "zh" ? "en" : "zh";
localStorage.setItem('siteLang', currentLang);
setHeaderLang(currentLang);
};
if (currentFlag && currentLangText) {
// 检查图片路径是否需要调整
const isRootPage = window.location.pathname.includes('index.html') ||
window.location.pathname.endsWith('/');
const imgPathPrefix = isRootPage ? './imgs/flags/' : '../imgs/flags/';
if (lang === 'en') {
currentFlag.src = `${imgPathPrefix}en.svg`;
currentLangText.textContent = 'English';
} else {
currentFlag.src = `${imgPathPrefix}zh.svg`;
currentLangText.textContent = '简体中文';
}
}
}
function setHeaderLang(lang) {
const data = headerLangData[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;
document.getElementById("logo-img").src = data.logo;
// 导航文本
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;
// 更新语言显示
updateHeaderLanguageDisplay(lang);
}
// 处理语言切换
function handleHeaderLangToggle(lang) {
window.currentLang = lang;
localStorage.setItem('siteLang', lang);
setHeaderLang(lang);
// 如果有页面特定的语言处理函数，也调用它
if (typeof applyLang === 'function') {
applyLang(lang);
}
// 如果在aboutUs页面，还需要更新地图信息
if (typeof updateMapInfo === 'function') {
updateMapInfo(lang);
}
}
document.addEventListener('DOMContentLoaded', () => {
document.getElementById("lang-toggle").addEventListener("click", handleHeaderLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleHeaderLangToggle();
});
// 页面加载时自动切换到上次选择的语言
let currentLang = localStorage.getItem('siteLang') || "zh";
// 初始化语言
setHeaderLang(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) {
e.stopPropagation(); // 阻止事件冒泡
langDropdown.classList.toggle('show');
const arrow = langBtn.querySelector('.arrow');
if (arrow) {
arrow.style.transform = langDropdown.classList.contains('show') ? 'rotate(180deg)' : 'rotate(0)';
}
});
// 点击其他区域关闭下拉菜单
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) {
currentLang = lang;
handleHeaderLangToggle(lang);
}
langDropdown.classList.remove('show');
const arrow = langBtn.querySelector('.arrow');
if (arrow) {
arrow.style.transform = 'rotate(0)';
}
});
});
} else {
// 兼容旧版切换按钮
const langToggle = document.getElementById("lang-toggle");
if (langToggle) {
langToggle.addEventListener("click", () => {
currentLang = currentLang === "zh" ? "en" : "zh";
handleHeaderLangToggle(currentLang);
});
langToggle.addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") {
currentLang = currentLang === "zh" ? "en" : "zh";
handleHeaderLangToggle(currentLang);
}
});
}
}
});

228
hanJing/js/index.js
View File

@ -149,19 +149,6 @@ list.addEventListener('transitionend', () => {
}
});
// // 绑定按钮事件
// prevBtn.addEventListener('click', () => {
// prevSlide();
// stopAutoPlay();
// startAutoPlay();
// });
// nextBtn.addEventListener('click', () => {
// nextSlide();
// stopAutoPlay();
// startAutoPlay();
// });
// 绑定指示器点击事件
indicators.forEach((indicator, index) => {
indicator.addEventListener('click', () => {
@ -221,7 +208,6 @@ const langData = {
bannerListImgs: [
"../imgs/home/mainBusiness.png",
"../imgs/home/aboutUs.png",
],
CarouselImgs: [
"./imgs/home/Y100.jpg",
@ -244,7 +230,6 @@ const langData = {
newBottomText: "研究生学历",
emailLeftTitle: "我们准备好了",
emailLeftText: "如果您有更多的需求，请联系我们",
},
en: {
nav: {
@ -261,7 +246,6 @@ const langData = {
bannerListImgs: [
"../imgs/home/mainBusiness_en.png",
"../imgs/home/aboutUs_en.png",
],
CarouselImgs: [
"./imgs/home/Y100_en.jpg",
@ -284,30 +268,56 @@ const langData = {
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');
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];
// 导航文本
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;
// 导航文本 - 使用常规的条件检查而不是可选链
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;
// 按钮文本
document.getElementById("lang-toggle").textContent = data.btn;
// logo
document.getElementById("logo-img").src = data.logo;
document.getElementById("footerLogo").src = data.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 => {
@ -322,66 +332,140 @@ function applyLang(lang) {
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;
// 其它页面内容 - 单独处理每个元素
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') {
document.querySelector('.textBox').classList.add('en');
textBox.classList.add('en');
} else {
document.querySelector('.textBox').classList.remove('en');
textBox.classList.remove('en');
}
}
// bannerBottomList 背景图片
const bannerListClasses = [
".bannertop",
".bannerBottom",
];
bannerListClasses.forEach((cls, idx) => {
const el = document.querySelector(cls);
if (el) {
el.style.backgroundImage = `url(${data.bannerListImgs[idx]})`;
}
});
const bannerTop = document.querySelector(".bannertop");
if (bannerTop && data.bannerListImgs[0]) {
bannerTop.style.backgroundImage = `url(${data.bannerListImgs[0]})`;
}
function handleLangToggle() {
currentLang = currentLang === "zh" ? "en" : "zh";
const bannerBottom = document.querySelector(".bannerBottom");
if (bannerBottom && data.bannerListImgs[1]) {
bannerBottom.style.backgroundImage = `url(${data.bannerListImgs[1]})`;
}
} catch (error) {
console.error("语言切换出错:", error);
}
}
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');
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
// 切换下拉菜单显示/隐藏
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)';
}
});
// 点击其他区域关闭下拉菜单
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)';
}
});
});
});

159
hanJing/js/mainBusiness.js
View File

@ -119,29 +119,49 @@ document.addEventListener('DOMContentLoaded', function () {
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;
// const footerLogo = document.getElementById("footerLogo");
// if (footerLogo) footerLogo.src = data.logo;
// 页面内容
document.getElementById("title").textContent = data.title;
const titleElement = document.getElementById("title");
if (titleElement) titleElement.textContent = data.title;
// 顶部标题和描述
document.querySelector('.topBannerLeftTitle p:nth-child(1)').textContent = data.topBannerTitle;
document.querySelector('.topBannerLeftTitle p:nth-child(2)').textContent = data.topBannerDesc;
const topBannerTitle = document.querySelector('.topBannerLeftTitle p:nth-child(1)');
if (topBannerTitle) topBannerTitle.textContent = data.topBannerTitle;
const topBannerDesc = document.querySelector('.topBannerLeftTitle p:nth-child(2)');
if (topBannerDesc) topBannerDesc.textContent = data.topBannerDesc;
// 手风琴
const accordionItems = document.querySelectorAll('.accordion-item');
data.accordion.forEach((item, idx) => {
if (accordionItems[idx]) {
accordionItems[idx].querySelector('.accordion-header h3').textContent = item.title;
accordionItems[idx].querySelector('.accordion-content p').textContent = item.content;
const header = accordionItems[idx].querySelector('.accordion-header h3');
if (header) header.textContent = item.title;
const content = accordionItems[idx].querySelector('.accordion-content p');
if (content) content.textContent = item.content;
}
});
@ -165,49 +185,114 @@ document.addEventListener('DOMContentLoaded', function () {
}
});
// 页脚和其他内容
const emailLeftTitle = document.querySelector(".emailLeftTitle");
if (emailLeftTitle) emailLeftTitle.textContent = data.emailLeftTitle;
const emailLeftText = document.querySelector(".emailLeftText");
if (emailLeftText) emailLeftText.textContent = data.emailLeftText;
const footerBoxRightTitle = document.querySelector('.footerBoxRightTitle');
if (footerBoxRightTitle) footerBoxRightTitle.textContent = data.title;
document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
document.querySelector(".emailLeftText").textContent = data.emailLeftText;
document.querySelector('.footerBoxRightTitle').textContent = data.title;
// 背景图
document.querySelector('.bannertop').style.backgroundImage = `url(${data.bannertopBG})`;
document.querySelector('.bannerBottom').style.backgroundImage = `url(${data.bannerBottomBG})`;
const bannertop = document.querySelector('.bannertop');
if (bannertop) bannertop.style.backgroundImage = `url(${data.bannertopBG})`;
const bannerBottom = document.querySelector('.bannerBottom');
if (bannerBottom) bannerBottom.style.backgroundImage = `url(${data.bannerBottomBG})`;
// 切换样式
const topBannerLeftTitle = document.querySelector('.topBannerLeftTitle');
const topBannerLeft = document.querySelector('.topBannerLeft');
if (lang === 'en') {
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.add('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.add('en');
document.querySelector('.topBannerLeft').classList.add('en');
if (topBannerTitle) topBannerTitle.classList.add('en');
if (topBannerDesc) topBannerDesc.classList.add('en');
if (topBannerLeft) topBannerLeft.classList.add('en');
} else {
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.remove('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.remove('en');
document.querySelector('.topBannerLeft').classList.remove('en');
if (topBannerTitle) topBannerTitle.classList.remove('en');
if (topBannerDesc) topBannerDesc.classList.remove('en');
if (topBannerLeft) topBannerLeft.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);
updateLanguageDisplay(currentLang);
// 获取语言切换相关的DOM元素
const langBtn = document.getElementById('lang-btn');
const langDropdown = document.getElementById('lang-dropdown');
const langItems = document.querySelectorAll('.lang-item');
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
// 切换下拉菜单显示/隐藏
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';
}
console.log('修改后显示状态:', langDropdown.style.display);
// 旋转箭头
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)';
}
}
});
// 语言选择事件
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)';
}
});
});
// 注释掉旧的事件绑定代码
// document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
// document.getElementById("lang-toggle").addEventListener("keydown", e => {
// if (e.key === "Enter" || e.key === " ") handleLangToggle();
// });
});

207
hanJing/js/ourProducts.js
View File

@ -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;
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;
// 解决方案和技术亮点文本
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,
};
// 遍历并应用文本
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');
if (topBannerLeftTitle1) topBannerLeftTitle1.classList.add('en');
if (topBannerLeftTitle2) topBannerLeftTitle2.classList.add('en');
} else {
document.getElementById('topBannerLeftTitle1').classList.remove('en');
document.getElementById('topBannerLeftTitle2').classList.remove('en');
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);
updateLanguageDisplay(currentLang);
// 获取语言切换相关的DOM元素
const langBtn = document.getElementById('lang-btn');
const langDropdown = document.getElementById('lang-dropdown');
const langItems = document.querySelectorAll('.lang-item');
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
// 切换下拉菜单显示/隐藏
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();
// });
});

146
hanJing/js/technicalSupport.js
View File

@ -62,59 +62,157 @@ document.addEventListener('DOMContentLoaded', function () {
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;
document.querySelector('.footerBoxRightTitle').textContent = data.title;
// const footerLogo = document.getElementById("footerLogo");
// if (footerLogo) footerLogo.src = data.logo;
const footerBoxRightTitle = document.querySelector('.footerBoxRightTitle');
if (footerBoxRightTitle) footerBoxRightTitle.textContent = data.title;
// 页面标题
document.title = data.title;
// 顶部标题和描述
document.querySelector('.topBannerLeftTitle p:nth-child(1)').textContent = data.topBannerTitle;
document.querySelector('.topBannerLeftTitle p:nth-child(2)').textContent = data.topBannerDesc;
const topBannerTitle = document.querySelector('.topBannerLeftTitle p:nth-child(1)');
if (topBannerTitle) topBannerTitle.textContent = data.topBannerTitle;
const topBannerDesc = document.querySelector('.topBannerLeftTitle p:nth-child(2)');
if (topBannerDesc) topBannerDesc.textContent = data.topBannerDesc;
// 三大服务
const serviceBoxes = document.querySelectorAll('.bannerBox > .bannerLeft, .bannerBox > .bannerRight');
data.service.forEach((item, idx) => {
if (serviceBoxes[idx]) {
serviceBoxes[idx].querySelector('.title').textContent = item.title;
serviceBoxes[idx].querySelector('.problem').textContent = item.desc;
serviceBoxes[idx].querySelector('.report').childNodes[0].nodeValue = item.btn + " ";
const titleElement = serviceBoxes[idx].querySelector('.title');
if (titleElement) titleElement.textContent = item.title;
const descElement = serviceBoxes[idx].querySelector('.problem');
if (descElement) descElement.textContent = item.desc;
const reportElement = serviceBoxes[idx].querySelector('.report');
if (reportElement && reportElement.childNodes[0]) {
reportElement.childNodes[0].nodeValue = item.btn + " ";
}
}
});
// 邮箱区
document.querySelector(".emailLeftTitle").textContent = data.emailLeftTitle;
document.querySelector(".emailLeftText").textContent = data.emailLeftText;
const emailLeftTitle = document.querySelector(".emailLeftTitle");
if (emailLeftTitle) emailLeftTitle.textContent = data.emailLeftTitle;
const emailLeftText = document.querySelector(".emailLeftText");
if (emailLeftText) emailLeftText.textContent = data.emailLeftText;
// 按钮文本
document.getElementById("lang-toggle").textContent = data.btn;
// 背景图
document.querySelector('.topBanner').style.backgroundImage = `url(${data.topBannerBG})`;
// 英文样式调整（如有需要可扩展）
const topBanner = document.querySelector('.topBanner');
if (topBanner) topBanner.style.backgroundImage = `url(${data.topBannerBG})`;
// 英文样式调整
if (lang === 'en') {
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.add('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.add('en');
if (topBannerTitle) topBannerTitle.classList.add('en');
if (topBannerDesc) topBannerDesc.classList.add('en');
} else {
document.querySelector('.topBannerLeftTitle p:nth-child(1)').classList.remove('en');
document.querySelector('.topBannerLeftTitle p:nth-child(2)').classList.remove('en');
}
if (topBannerTitle) topBannerTitle.classList.remove('en');
if (topBannerDesc) topBannerDesc.classList.remove('en');
}
function handleLangToggle() {
currentLang = currentLang === "zh" ? "en" : "zh";
// 更新语言显示
updateLanguageDisplay(lang);
}
// 修正的handleLangToggle函数，正确接收lang参数
function handleLangToggle(lang) {
currentLang = lang;
localStorage.setItem('siteLang', currentLang);
applyLang(currentLang);
updateLanguageDisplay(currentLang);
}
// 初始化
applyLang(currentLang);
updateLanguageDisplay(currentLang);
// 事件绑定
document.getElementById("lang-toggle").addEventListener("click", handleLangToggle);
document.getElementById("lang-toggle").addEventListener("keydown", e => {
if (e.key === "Enter" || e.key === " ") handleLangToggle();
// 获取语言切换相关的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();
// });
});