Duguay/all-personal-resume
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Initial commit: 12个专业个人简历作品集项目

Browse Source
This commit is contained in:
KQL
2025-11-15 18:32:08 +08:00
commit b690b4663c
896 changed files with 726841 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files

498
个人简历_大健康/health-script.js Normal file
View File

@@ -0,0 +1,498 @@
/* ======================================
大健康产业个人简历 - 交互脚本
====================================== */
// 页面加载完成后执行
document.addEventListener('DOMContentLoaded', function() {
// 隐藏加载动画
setTimeout(() => {
const loadingScreen = document.getElementById('loadingScreen');
if (loadingScreen) {
loadingScreen.style.opacity = '0';
setTimeout(() => {
loadingScreen.style.display = 'none';
}, 500);
}
}, 1500);
// 初始化GSAP动画
initGSAPAnimations();
// 初始化图表
initCharts();
// 平滑滚动导航
initSmoothScrolling();
// 技能卡片交互
initSkillCardAnimations();
// 项目卡片交互
initProjectCardAnimations();
});
// GSAP动画初始化
function initGSAPAnimations() {
// 注册ScrollTrigger插件
gsap.registerPlugin(ScrollTrigger);
// Hero区域动画
gsap.from('.hero-image img', {
duration: 1,
scale: 0.8,
opacity: 0,
ease: 'back.out(1.7)'
});
gsap.from('.hero-info h1', {
duration: 1,
x: -50,
opacity: 0,
delay: 0.3,
ease: 'power2.out'
});
gsap.from('.hero-title', {
duration: 1,
x: -30,
opacity: 0,
delay: 0.5,
ease: 'power2.out'
});
gsap.from('.hero-badges .badge', {
duration: 0.8,
y: 20,
opacity: 0,
delay: 0.7,
stagger: 0.1,
ease: 'power2.out'
});
gsap.from('.hero-description', {
duration: 1,
y: 30,
opacity: 0,
delay: 1,
ease: 'power2.out'
});
// 区域滚动动画
gsap.utils.toArray('.education-section, .about-section, .skills-section, .projects-section').forEach(section => {
gsap.fromTo(section,
{ y: 50, opacity: 0 },
{
y: 0,
opacity: 1,
duration: 1,
ease: 'power2.out',
scrollTrigger: {
trigger: section,
start: 'top 80%',
toggleActions: 'play none none reverse'
}
}
);
});
// 技能卡片动画
gsap.utils.toArray('.skill-card').forEach((card, index) => {
gsap.fromTo(card,
{ y: 30, opacity: 0 },
{
y: 0,
opacity: 1,
duration: 0.6,
delay: index * 0.05,
ease: 'power2.out',
scrollTrigger: {
trigger: card,
start: 'top 85%',
toggleActions: 'play none none reverse'
}
}
);
});
// 项目卡片动画
gsap.utils.toArray('.project-card').forEach((card, index) => {
gsap.fromTo(card,
{ y: 40, opacity: 0, scale: 0.95 },
{
y: 0,
opacity: 1,
scale: 1,
duration: 0.8,
delay: index * 0.1,
ease: 'power2.out',
scrollTrigger: {
trigger: card,
start: 'top 85%',
toggleActions: 'play none none reverse'
}
}
);
});
}
// 平滑滚动导航
function initSmoothScrolling() {
document.querySelectorAll('a[href^="#"]').forEach(anchor => {
anchor.addEventListener('click', function (e) {
e.preventDefault();
const target = document.querySelector(this.getAttribute('href'));
if (target) {
const headerHeight = document.querySelector('.nav-container').offsetHeight;
const targetPosition = target.offsetTop - headerHeight - 20;
window.scrollTo({
top: targetPosition,
behavior: 'smooth'
});
}
});
});
}
// 技能卡片交互动画
function initSkillCardAnimations() {
const skillCards = document.querySelectorAll('.skill-card');
skillCards.forEach(card => {
card.addEventListener('mouseenter', function() {
gsap.to(this, {
scale: 1.02,
duration: 0.3,
ease: 'power2.out'
});
});
card.addEventListener('mouseleave', function() {
gsap.to(this, {
scale: 1,
duration: 0.3,
ease: 'power2.out'
});
});
});
}
// 项目卡片交互动画
function initProjectCardAnimations() {
const projectCards = document.querySelectorAll('.project-card');
projectCards.forEach(card => {
card.addEventListener('mouseenter', function() {
gsap.to(this, {
y: -8,
duration: 0.3,
ease: 'power2.out'
});
});
card.addEventListener('mouseleave', function() {
gsap.to(this, {
y: 0,
duration: 0.3,
ease: 'power2.out'
});
});
});
}
// 图表初始化
function initCharts() {
// 服务领域分布饼图
const pieChart = echarts.init(document.getElementById('pieChart'));
const pieOption = {
color: ['#10b981', '#34d399', '#6ee7b7', '#059669', '#16a34a', '#065f46'],
tooltip: {
trigger: 'item',
formatter: '{a} <br/>{b}: {c} ({d}%)'
},
series: [{
name: '服务领域',
type: 'pie',
radius: ['30%', '70%'],
avoidLabelOverlap: false,
label: {
show: false,
position: 'center'
},
emphasis: {
label: {
show: true,
fontSize: '16',
fontWeight: 'bold'
}
},
labelLine: {
show: false
},
data: [
{ value: 35, name: '产后康复' },
{ value: 20, name: '慢病管理' },
{ value: 15, name: '轻医美护理' },
{ value: 12, name: '药品质控' },
{ value: 10, name: '健康教育' },
{ value: 8, name: '数字医疗' }
]
}]
};
pieChart.setOption(pieOption);
// 核心能力雷达图
const radarChart = echarts.init(document.getElementById('radarChart'));
const radarOption = {
color: ['#10b981'],
tooltip: {},
radar: {
indicator: [
{ name: '健康监测', max: 100 },
{ name: '数据分析', max: 100 },
{ name: '康复护理', max: 100 },
{ name: '慢病管理', max: 100 },
{ name: '医疗设备', max: 100 },
{ name: '健康教育', max: 100 },
{ name: '质量管理', max: 100 },
{ name: '智慧医疗', max: 100 }
],
radius: 80,
axisLine: {
lineStyle: {
color: '#d1fae5'
}
},
splitArea: {
areaStyle: {
color: ['rgba(16, 185, 129, 0.1)', 'rgba(16, 185, 129, 0.05)']
}
}
},
series: [{
name: '能力评估',
type: 'radar',
data: [{
value: [90, 85, 88, 82, 87, 92, 80, 75],
name: '专业能力'
}],
areaStyle: {
opacity: 0.3
}
}]
};
radarChart.setOption(radarOption);
// 项目经验时间线
const timelineChart = echarts.init(document.getElementById('timelineChart'));
const timelineOption = {
color: ['#10b981'],
tooltip: {
trigger: 'axis',
axisPointer: {
type: 'shadow'
}
},
xAxis: {
type: 'category',
data: ['2023.01', '2023.06', '2023.09', '2024.01', '2024.03', '2024.09'],
axisLine: {
lineStyle: {
color: '#d1fae5'
}
},
axisLabel: {
color: '#6b7280',
fontSize: 12
}
},
yAxis: {
type: 'value',
name: '项目数量',
axisLine: {
lineStyle: {
color: '#d1fae5'
}
},
axisLabel: {
color: '#6b7280'
},
splitLine: {
lineStyle: {
color: '#d1fae5'
}
}
},
series: [{
name: '项目经验',
type: 'bar',
data: [1, 1, 2, 2, 3, 4],
itemStyle: {
borderRadius: [4, 4, 0, 0],
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#34d399' },
{ offset: 1, color: '#10b981' }
])
},
emphasis: {
itemStyle: {
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
{ offset: 0, color: '#6ee7b7' },
{ offset: 1, color: '#34d399' }
])
}
}
}]
};
timelineChart.setOption(timelineOption);
// 响应式图表
window.addEventListener('resize', function() {
pieChart.resize();
radarChart.resize();
timelineChart.resize();
});
}
// 导航栏滚动效果
window.addEventListener('scroll', function() {
const nav = document.querySelector('.nav-container');
if (window.scrollY > 100) {
nav.style.backgroundColor = 'rgba(255, 255, 255, 0.98)';
nav.style.boxShadow = '0 2px 20px rgba(16, 185, 129, 0.15)';
} else {
nav.style.backgroundColor = 'rgba(255, 255, 255, 0.95)';
nav.style.boxShadow = '0 2px 20px rgba(16, 185, 129, 0.1)';
}
});
// 添加简单的滚动进度指示器
function createScrollProgress() {
const progressBar = document.createElement('div');
progressBar.style.cssText = `
position: fixed;
top: 0;
left: 0;
width: 0%;
height: 3px;
background: linear-gradient(90deg, #10b981, #34d399);
z-index: 10000;
transition: width 0.1s ease;
`;
document.body.appendChild(progressBar);
window.addEventListener('scroll', function() {
const windowHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
const scrolled = (window.scrollY / windowHeight) * 100;
progressBar.style.width = scrolled + '%';
});
}
// 初始化滚动进度条
createScrollProgress();
// 联系方式按钮点击效果
document.querySelectorAll('.contact-item').forEach(item => {
item.addEventListener('click', function() {
const contactValue = this.querySelector('.contact-value').textContent;
// 根据联系方式类型进行相应处理
if (contactValue.includes('@')) {
// 邮箱
window.location.href = `mailto:${contactValue}`;
} else if (contactValue.match(/\d{3}-\d{4}-\d{4}/)) {
// 电话
window.location.href = `tel:${contactValue.replace(/-/g, '')}`;
}
// 点击动画效果
gsap.to(this, {
scale: 0.95,
duration: 0.1,
yoyo: true,
repeat: 1
});
});
});
// 技能编号动画效果
function animateSkillNumbers() {
const skillNumbers = document.querySelectorAll('.skill-number');
const observer = new IntersectionObserver((entries) => {
entries.forEach(entry => {
if (entry.isIntersecting) {
const number = entry.target;
gsap.fromTo(number,
{ scale: 0, rotation: -180 },
{
scale: 1,
rotation: 0,
duration: 0.6,
ease: 'back.out(1.7)'
}
);
observer.unobserve(number);
}
});
}, { threshold: 0.8 });
skillNumbers.forEach(number => observer.observe(number));
}
// 初始化技能编号动画
animateSkillNumbers();
// 添加键盘导航支持
document.addEventListener('keydown', function(e) {
const sections = ['home', 'education', 'skills', 'projects', 'contact'];
let currentIndex = -1;
// 找到当前所在区域
for (let i = 0; i < sections.length; i++) {
const section = document.getElementById(sections[i]);
const rect = section.getBoundingClientRect();
if (rect.top <= 100 && rect.bottom > 100) {
currentIndex = i;
break;
}
}
// 按键导航
if (e.key === 'ArrowDown' && currentIndex < sections.length - 1) {
e.preventDefault();
document.getElementById(sections[currentIndex + 1]).scrollIntoView({
behavior: 'smooth',
block: 'start'
});
} else if (e.key === 'ArrowUp' && currentIndex > 0) {
e.preventDefault();
document.getElementById(sections[currentIndex - 1]).scrollIntoView({
behavior: 'smooth',
block: 'start'
});
}
});
// 添加右键菜单禁用（可选）
document.addEventListener('contextmenu', function(e) {
e.preventDefault();
});
// 页面加载性能优化
if ('serviceWorker' in navigator) {
window.addEventListener('load', function() {
navigator.serviceWorker.register('/sw.js')
.then(function(registration) {
console.log('ServiceWorker registration successful');
})
.catch(function(err) {
console.log('ServiceWorker registration failed');
});
});
}
console.log('🏥 大健康产业个人简历网站已加载完成！');
console.log('📧 联系邮箱: zhangmj@health.com');
console.log('📱 联系电话: 138-8888-8888');