Add photo overlay feature and update biography section

This commit is contained in:
2025-11-27 07:25:12 +03:30
parent 7dfd9d8639
commit 249b34215f
4 changed files with 83 additions and 10 deletions

View File

@@ -25,8 +25,8 @@
<img src="resources/dr_circle.png" alt="عکس پروفایل" class="profile-pic">
<h2>بیوگرافی</h2>
<p>
مرتضی اسدی هستم فارغ التحصیل رشته پزشکی عمومی سال 95 از دانشگاه اردبیل و تخصص روانپزشکی از دانشگاه تبریز
سال 99 به عنوان پزشک وظیفه در بیمارستان الغدیر ناجا تبریز مشغول بودم، از اول سال ۱۴۰۱ تا سال ۱۴۰۳ در بیمارستان مدنی اذرشهر مشغول فعالیت بودم و در حال حاضر در مطب شخصی خود در شهرستان تبریز در خدمت بیماران هستم.
مرتضی اسدی هستم فارغ التحصیل رشته پزشکی عمومی سال ۹۵ از دانشگاه اردبیل و تخصص روانپزشکی از دانشگاه تبریز
سال ۹۹ به عنوان پزشک وظیفه در بیمارستان الغدیر ناجا تبریز مشغول بودم، از اول سال ۱۴۰۱ تا سال ۱۴۰۳ در بیمارستان مدنی اذرشهر مشغول فعالیت بودم و در حال حاضر در مطب شخصی خود در شهرستان تبریز در خدمت بیماران هستم.
در زمینه ی درمان دارویی و غیر دارویی، اختلالات افسردگی و خلقی، اضطرابی و پانیک، بی خوابی، تمرکز و مشکلات تحصیلی، مشاوره برای کنکور، اختلالات زناشویی، اختلالات جنسی مردان و زنان و زوج درمانی، مشکلات دوران سوگ و اختلالات کودکان مثل بیش فعالی، شب ادراری و افسردگی و اضطراب کودکان در خدمت شما عزیزان هستم.
</p>
</section>
@@ -50,15 +50,15 @@
<h3>تجربیات کاری</h3>
<ul>
<li>
<h3>پزشک وظیفه</h3>
<h3>روان‌پزشک نیروی انتظامی</h3>
<p>بیمارستان الغدیر ناجا تبریز، ۱۳۹۹-۱۴۰۱</p>
</li>
<li>
<h3>پزشک</h3>
<h3>روان‌پزشک</h3>
<p>بیمارستان مدنی آذرشهر، ۱۴۰۱-۱۴۰۳</p>
</li>
<li>
<h3>روانپزشک</h3>
<h3>روانپزشک</h3>
<p>مطب شخصی، ۱۴۰۳-حال حاضر</p>
</li>
</ul>
@@ -66,7 +66,7 @@
</section>
<section id="certifications" class="scroll-section">
<h2>گواهینامه ها</h2>
<h2>گواهینامهها</h2>
<div class="cert-gallery">
<img src="resources/certification.jpg" alt="گواهینامه">
</div>
@@ -76,12 +76,17 @@
<h2>اطلاعات تماس</h2>
<div class="contact-info">
<p><strong>آدرس مطب:</strong> تبریز، ائل گلی، چهارراه خیام به سمت رجایی شهر، برج رستار، طبقه 5</p>
<p><strong>تلفن تماس:</strong> 04133814661</p>
<p><strong>تلفن تماس:</strong> <span dir="ltr">+98 41 3381 4661</span></p>
<p><strong>شماره واتساپ:</strong> <span dir="ltr">+98 999 10 23 222</span></p>
</div>
</section>
</main>
<script src="script.js"></script>
<div id="photo-overlay" class="hidden">
<span class="close-btn">&times;</span>
<img src="resources/dr_photo.png" alt="عکس دکتر مرتضی اسدی" class="overlay-photo">
</div>
</body>
</html>

BIN
resources/dr_photo.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 6.4 MiB

View File

@@ -1,6 +1,6 @@
document.addEventListener('DOMContentLoaded', function() {
// Scroll-reveal effect
const sections = document.querySelectorAll('.scroll-section');
const observer = new IntersectionObserver(entries => {
entries.forEach(entry => {
if (entry.isIntersecting) {
@@ -10,8 +10,28 @@ document.addEventListener('DOMContentLoaded', function() {
}, {
threshold: 0.1
});
sections.forEach(section => {
observer.observe(section);
});
// Photo overlay
const profilePic = document.querySelector('.profile-pic');
const photoOverlay = document.getElementById('photo-overlay');
const closeBtn = document.querySelector('.close-btn');
if (profilePic && photoOverlay && closeBtn) {
profilePic.addEventListener('click', () => {
photoOverlay.classList.add('show');
});
closeBtn.addEventListener('click', () => {
photoOverlay.classList.remove('show');
});
photoOverlay.addEventListener('click', (e) => {
if (e.target === photoOverlay) {
photoOverlay.classList.remove('show');
}
});
}
});

View File

@@ -136,3 +136,51 @@ ul li h3 {
font-size: 1.8rem;
}
}
/* Photo Overlay */
#photo-overlay {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background-color: rgba(0, 0, 0, 0.8);
display: flex;
justify-content: center;
align-items: center;
z-index: 1000;
opacity: 0;
visibility: hidden;
transition: opacity 0.3s ease, visibility 0.3s ease;
}
#photo-overlay.show {
opacity: 1;
visibility: visible;
}
.overlay-photo {
max-width: 80%;
max-height: 80%;
border-radius: 10px;
transform: scale(0.8);
transition: transform 0.3s ease;
}
#photo-overlay.show .overlay-photo {
transform: scale(1);
}
.close-btn {
position: absolute;
top: 20px;
right: 30px;
color: #fff;
font-size: 40px;
cursor: pointer;
}
.profile-pic {
cursor: pointer;
}