جدول اطلاعات محصول/دماوند پلیمر - فراغیب

→ تفاوت با ویرایش قدیمی‌تر تفاوت با ویرایش جدیدتر ←

نسخهٔ ‏۲۶ ژوئیهٔ ۲۰۲۶، ساعت ۱۴:۵۲

جدول معرفی انواع مخازن، کاربرد و مزایای هر نوع
نام یا مدل مخزن	ظرفیت و ابعاد (لیست ویژگی‌ها)	محل پیشنهادی برای نصب
مخزن آب افقی	بدنه کشیده با قطر کم، تمرکز بر توزیع وزن در طول مسیر، پایداری بالا در سطوح گسترده.	فضاهای طولانی و باریک، حیاط‌های مستطیلی، یا مسیرهای انتقال آب در سطح زمین.
مخزن آب عمودی	اشغال فضای سطحی بسیار کم، تمرکز بر ارتفاع، فشار هیدرولیکی مناسب در ارتفاع‌های بالا.	پشت‌بام‌ها، فضاهای باز با محدودیت عرض، یا کنار دیوارها.
مخزن کتابی (کم‌جا)	عرض بسیار کم و طراحی فشرده، طراحی ارگونومیک برای عبور از فضاهای تنگ، بهینه‌سازی حداکثری فضا.	فضای بین دیوار و نرده، کناره‌های راهروها، یا کناره‌های ساختمان.
مخزن آب زیر پله	طراحی متناسب با شیب و زوایای نامتقارن، استفاده از فضای مرده (Dead Space) زیر سازه.	زیر پله‌ها، زیر پلکان‌های بیرونی یا در حیاط‌های شیب‌دار.
مخزن قیفی	طراحی با قاعده جمع‌شونده، تخلیه کامل و سریع آب بدون باقی ماندن رسوبات در کف.	سیستم‌های تخلیه صنعتی یا مخازنی که نیاز به تخلیه سریع و کامل دارند.
مخزن بیضی	توزیع یکنواخت فشار در بدنه، کاهش تنش‌های مکانیکی در دیواره‌ها، طراحی ارگونومیک و زیبا.	فضاهای باغی یا محیط‌های با طراحی مدرن که نیاز به ظاهری زیباتر از مخازن استاندار دارند.
مخزن آسان رو	ویژگی‌ها: ارتفاع زیاد با سطح اشغال شده بسیار کم، طراحی عمودی صلب، مناسب برای ایجاد فشار در ارتفاع.	محل نصب: فضاهای بسیار باریک و بلند، بالای برج‌ها یا در کنار ستون‌های ساختمانی.
مخزن آب مکعبی	ویژگی‌ها: استفاده حداکثری از حجم در یک قالب مشخص، قابلیت چیدمان کنار هم (Stacking) در صورت نیاز.	محل نصب: گوشه‌های حیاط، داخل انبارهای کوچک یا فضاهایی با خطوط مستقیم و زاویه‌دار.
مخزن نیسانی	ویژگی‌ها: طراحی خاص با قابلیت حمل آسان، بدنه مقاوم در برابر ضربه و لرزش، توزیع وزن متمرکز.	محل نصب: کاربردهای متحرک، یا مخازنی که نیاز به جابه‌جایی یا قرارگیری در نقاط دارای لرزش دارند.
مخزن کروی	ویژگی‌ها: بهترین توزیع فشار در تمام نقاط بدنه، استحکام بسیار بالا در برابر فشار داخلی، کمترین میزان تلفات متریال.	محل نصب: فضاهای صنعتی یا مخازنی که تحت فشار بالا هستند و نیاز به ایمنی حداکثری دارند.
مخزن انبساط	ویژگی‌ها: طراحی مخصوص مدیریت تغییرات حجم سیال، قابلیت جذب فشار ناشی از تغییر دمای آب، محافظت از سیستم لوله‌کشی.	محل نصب: در کنار پمپ‌ها، سیستم‌های گرمایشی/سرمایشی و در مسیرهای اصلی لوله‌کشی ساختمان.

@@ خط ۱: / خط ۱: @@
 <html>
-<section class="banner-table-section" dir="rtl" lang="fa" aria-labelledby="banner-types-title">
+<style>
-   <div class="banner-table-wrap">
+  /* استایل‌های پایه و ظرف اصلی */
+  .banner-table-section {
+    margin: 20px 0;
+    font-family: 'IRANSansXFaNum', Tahoma, Arial, sans-serif;
+  }
+  .banner-table-title {
+    text-align: center;
+    font-size: 1.5rem;
+    margin-bottom: 20px;
+    color: #333;
+  }
+  /* مدیریت ریسپانسیو برای موبایل */
+  .banner-table-responsive {
+    position: relative;
+    overflow: hidden; /* برای کنترل نمایش سطرها */
+    border: 1px solid #e0e0e0;
+    border-radius: 8px;
+    transition: max-height 0.5s ease-in-out;
+  }
+  .banner-table {
+    width: 100%;
+    border-collapse: collapse;
+    background-color: #fff;
+    text-align: right;
+  }
+  .banner-table th,
+  .banner-table td {
+    padding: 12px 15px;
+    border-bottom: 1px solid #eee;
+    font-size: 14px;
+    line-height: 1.6;
+  }
+  .banner-table th {
+    background-color: #f8f9fa;
+    color: #2c3e50;
+    font-weight: bold;
+  }
+  /* حالت محدود شده (فقط ۳ سطر) */
+  .banner-table-wrap.collapsed .banner-table-responsive {
+    max-height: 320px; /* ارتفاع تقریبی ۳ سطر */
+    overflow: hidden;
+  }
+  /* افکت محو شدن در انتهای ۳ سطر اول */
+  .banner-table-wrap.collapsed::after {
+    content: "";
+    position: absolute;
+    bottom: 50px; /* ارتفاع دکمه */
+    left: 0;
+    width: 100%;
+    height: 80px;
+    background: linear-gradient(to bottom, rgba(255,255,255,0), rgba(255,255,255,1));
+    pointer-events: none; /* اجازه کلیک به دکمه زیر این لایه */
+    z-index: 1;
+  }
+  /* دکمه نمایش بیشتر/کمتر */
+  .toggle-btn-container {
+    text-align: center;
+    margin-top: 15px;
+    position: relative;
+    z-index: 2;
+  }
+  .btn-expand {
+    background-color: #007bff;
+    color: white;
+    border: none;
+    padding: 10px 25px;
+    border-radius: 25px;
+    cursor: pointer;
+    font-size: 14px;
+    font-family: inherit;
+    transition: all 0.3s ease;
+    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
+  }
+  .btn-expand:hover {
+    background-color: #0056b3;
+    transform: translateY(-2px);
+  }
+  /* استایل مخصوص موبایل برای جدول */
+  @media screen and (max-width: 768px) {
+    .banner-table-responsive {
+      overflow-x: auto; /* اجازه اسکرول افقی در موبایل */
+      -webkit-overflow-scrolling: touch;
+    }
+    .banner-table th, .banner-table td {
+      min-width: 150px; /* جلوگیری از فشرده شدن بیش از حد متن در موبایل */
+    }
+    .banner-table-wrap.collapsed::after {
+        height: 60px;
+    }
+  }
+</style>
+<section class="banner-table-section collapsed" dir="rtl" lang="fa" aria-labelledby="banner-types-title">
+   <div class="banner-table-wrap" id="tableWrapper">
      <h2 id="banner-types-title" class="banner-table-title">انواع مخازن و کاربرد آن‌ها</h2>
-     <div class="banner-table-responsive" style="font-family: 'IRANSansXFaNum';">
+     <div class="banner-table-responsive">
        <table class="banner-table">
-         <caption>جدول معرفی انواع مخازن، کاربرد و مزایای هر نوع</caption>
+         <caption style="display:none;">جدول معرفی انواع مخازن، کاربرد و مزایای هر نوع</caption>
          <thead>
            <tr>
@@ خط ۳۰: / خط ۱۳۴: @@
              <td>فضای بین دیوار و نرده، کناره‌های راهروها، یا کناره‌های ساختمان.</td>
            </tr>
+          <!-- بقیه سطرها -->
            <tr>
              <td>مخزن آب زیر پله</td>
              <td>طراحی متناسب با شیب و زوایای نامتقارن، استفاده از فضای مرده (Dead Space) زیر سازه.</td>
-             <td>: زیر پله‌ها، زیر پلکان‌های بیرونی یا در حیاط‌های شیب‌دار.</td>
+             <td>زیر پله‌ها، زیر پلکان‌های بیرونی یا در حیاط‌های شیب‌دار.</td>
            </tr>
            <tr>
@@ خط ۴۳: / خط ۱۴۸: @@
              <td>مخزن بیضی</td>
              <td>توزیع یکنواخت فشار در بدنه، کاهش تنش‌های مکانیکی در دیواره‌ها، طراحی ارگونومیک و زیبا.</td>
-             <td> فضاهای باغی یا محیط‌های با طراحی مدرن که نیاز به ظاهری زیباتر از مخازن استاندار دارند.</td>
+             <td>فضاهای باغی یا محیط‌های با طراحی مدرن که نیاز به ظاهری زیباتر از مخازن استاندار دارند.</td>
            </tr>
             <tr>
@@ خط ۵۱: / خط ۱۵۶: @@
               </tr>
               <tr>
-                <td> مخزن آب مکعبی</td>
+                <td>مخزن آب مکعبی</td>
                 <td>ویژگی‌ها: استفاده حداکثری از حجم در یک قالب مشخص، قابلیت چیدمان کنار هم (Stacking) در صورت نیاز.</td>
                 <td>محل نصب: گوشه‌های حیاط، داخل انبارهای کوچک یا فضاهایی با خطوط مستقیم و زاویه‌دار.</td>
              </tr>
             <tr>
-               <td>مخزن نیسانی (شبیه به سبد نیسان)</td>
+               <td>مخزن نیسانی</td>
               <td>ویژگی‌ها: طراحی خاص با قابلیت حمل آسان، بدنه مقاوم در برابر ضربه و لرزش، توزیع وزن متمرکز.</td>
                <td>محل نصب: کاربردهای متحرک، یا مخازنی که نیاز به جابه‌جایی یا قرارگیری در نقاط دارای لرزش دارند.</td>
@@ خط ۷۳: / خط ۱۷۸: @@
        </table>
      </div>
+  </div>
+  <div class="toggle-btn-container">
+    <button class="btn-expand" onclick="toggleTable()" id="toggleBtn">مشاهده بقیه جدول</button>
    </div>
 </section>
+<script>
+  function toggleTable() {
+    const section = document.querySelector('.banner-table-section');
+    const btn = document.getElementById('toggleBtn');
+    if (section.classList.contains('collapsed')) {
+      // باز کردن جدول
+      section.classList.remove('collapsed');
+      btn.textContent = 'بستن و نمایش کمتر';
+    } else {
+      // بستن جدول
+      section.classList.add('collapsed');
+      btn.textContent = 'مشاهده بقیه جدول';
+      // اسکرول نرم به سمت بالای جدول وقتی بسته می‌شود
+      section.scrollIntoView({ behavior: 'smooth', block: 'nearest' });
+    }
+  }
+</script>
 </html>