Html and Css & Jsآموزش
ادمین : @Maryam3771 تعرفه تبلیغات: https://t.me/alloadv/822
Показати більше📈 Аналітичний огляд Telegram-каналу Html and Css & Jsآموزش
Канал Html and Css & Jsآموزش (@htmlcss_channels) у мовному сегменті Фарсі є активним учасником. На даний момент спільнота об'єднує 23 281 підписників, посідаючи 8 363 місце в категорії Освіта та 14 485 місце у регіоні Іран.
📊 Показники аудиторії та динаміка
З моменту свого створення невідомо, проект продемонстрував стрімке зростання, зібравши аудиторію у 23 281 підписників.
За останніми даними від 31 серпня, 2026, канал демонструє стабільну активність. Хоча за останні 30 днів спостерігається зміна кількості учасників на 413, а за останні 24 години на -23, загальне охоплення залишається високим.
- Статус верифікації: Не верифікований
- Рівень залученості (ER): Середній показник залученості аудиторії становить 3.25%. Протягом перших 24 годин після публікації контент зазвичай збирає 1.37% реакцій від загальної кількості підписників.
- Охоплення публікацій: В середньому кожен допис отримує 757 переглядів. Протягом першої доби публікація в середньому набирає 319 переглядів.
- Реакції та взаємодія: Аудиторія активно підтримує контент: середня кількість реакцій на один пост – 4.
- Тематичні інтереси: Контент зосереджений навколо ключових тем, таких як css, #javascript, دنیا, وبینار, شغل.
📝 Опис та контентна політика
Автор описує ресурс як майданчик для висловлення суб'єктивної думки:
“ادمین :
@Maryam3771
تعرفه تبلیغات:
https://t.me/alloadv/822”
Завдяки високій частоті оновлень (останні дані отримано 01 вересня, 2026), канал підтримує актуальність та високий рівень охоплення публікацій. Аналітика показує, що аудиторія активно взаємодіє з контентом, що робить його важливою точкою впливу в категорії Освіта.
این دوره مسیر آموزشی ساختاریافتهای است که طبق سرفصلهای بهروز علمی طراحی شده و شرکتکنندگان را از مبانی ریاضیات و یادگیری ماشین تا طراحی، پیادهسازی و استقرار مدلهای پیشرفته هوشمصنوعی همراهی میکند.🕒 ۱۵ هفته: ۵۰ ساعت (آموزش) ۳۰ ساعت (حل تمرین و کارگاه) 🚀 مخاطبان دوره: دانشجویان، پژوهشگران، تحلیلگران داده، مهندسان یادگیری ماشین، متخصصین علوم داده، مهندسین داده، برنامهنویسان و توسعهدهندگان نرمافزار، و سایر علاقهمندان هوش مصنوعی و یادگیری عمیق ℹ️ اطلاعات برگزاری: شنبهها و سهشنبهها ساعت ۱۸:۰۰ تا ۲۱:۲۰ شروع از ۱۷ شهریور ۱۴۰۵ شیوه برگزاری: آنلاین 👆 معرفی کامل دوره و سوالات متداول (pdf) ❌ پشتیبانی آموزشی، ارتباط مستمر با مدرسین در طول دوره و گواهی پایان دوره 🎰 اهداف دوره: ✔️ آشنایی با مفاهیم بنیادین یادگیری ماشین و شبکههای عصبی عمیق ✔️ آشنایی با ترنسفورمرها، ساخت چتبات با RAG و LangChain ✔️ یادگیری ساخت Agent هوشمند بر پایهی پروتکل MCP ✔️ آشنایی با روشهای بهینهسازی و استقرار مدلهای زبانی ✔️ اجرای یک پروژهی عملی برای جمعبندی و تثبیت مهارتهای آموختهشده ⏳ فرصت استفاده از تخفیف ثبت نام زودهنگام ۱: جمعه ۲۶ تیر ۱۴۰۵ ⚡️ تخفیف ویژه دانشجویان ❤️امکان پرداخت قسطی 🔍 درخواست پذیرش (پیش ثبتِنام): 🔗 b2n.ir/mlai05_mbn تماس: 📱 t.me/dlearnsup 📞 02188349244 📲 09103209837 @dlearn_ir
@view-transition {
navigation: auto;
}
همین! حالا هر جابهجایی بین صفحات، خودکار انیمیشن داره.
۲. شخصیسازی انیمیشن با @keyframes
میتونی تعیین کنی صفحه قدیم چطور محو بشه و صفحه جدید چطور ظاهر بشه:
::view-transition-old(root) {
animation: fadeOut 0.4s ease-out;
}
::view-transition-new(root) {
animation: fadeIn 0.4s ease-in;
}
@keyframes fadeOut {
to {
opacity: 0;
transform: translateY(-20px);
}
}
@keyframes fadeIn {
from {
opacity: 0;
transform: translateY(20px);
}
}
۳. انیمیشن اختصاصی برای یک المان خاص
فرض کن میخوای وقتی از یه صفحه به صفحه دیگه میری، یه کارت خاص جابهجا بشه. کافیه بهش یه view-transition-name بدی:
<article style="view-transition-name: hero-card;">
<h1>تیتر اصلی</h1>
<p>توضیحات کارت</p>
</article>
و تو CSS:
::view-transition-old(hero-card),
::view-transition-new(hero-card) {
animation-duration: 0.5s;
animation-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
}
۴. مثال کامل: یک صفحه با دو لینک
<!DOCTYPE html>
<html lang="fa" dir="rtl">
<head>
<meta charset="UTF-8">
<title>دموی View Transitions</title>
<style>
@view-transition {
navigation: auto;
}
body {
font-family: sans-serif;
padding: 2rem;
background: #f5f5f5;
}
.card {
background: white;
padding: 2rem;
border-radius: 12px;
box-shadow: 0 2px 8px rgba(0,0,0,0.1);
view-transition-name: main-card;
}
a {
display: inline-block;
margin-top: 1rem;
padding: 0.5rem 1rem;
background: #3b82f6;
color: white;
text-decoration: none;
border-radius: 6px;
}
::view-transition-old(root) {
animation: slideOut 0.3s ease-in;
}
::view-transition-new(root) {
animation: slideIn 0.3s ease-out;
}
@keyframes slideOut {
to { opacity: 0; transform: translateX(-30px); }
}
@keyframes slideIn {
from { opacity: 0; transform: translateX(30px); }
}
</style>
</head>
<body>
<div class="card">
<h1>صفحه اصلی</h1>
<p>روی دکمه زیر بزن تا انیمیشن جابهجایی رو ببینی.</p>
<a href="page2.html">برو به صفحه دوم</a>
</div>
</body>
</html>
۵. مثال با JavaScript (برای SPA)
function navigateTo(url) {
if (!document.startViewTransition) {
window.location.href = url;
return;
}
document.startViewTransition(() => {
window.location.href = url;
});
}
💎 @Htmlcss_channels | #HTML #css #JavaScript