الگو:کادر-شمارنده: تفاوت میان نسخه‌ها

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

نسخهٔ ‏۶ سپتامبر ۲۰۲۵، ساعت ۲۰:۴۵

نحوه استفاده:

{{کادر-شمارنده
 | icon  = User-icon.png
 | title = کاربران فعال
 | start = 1
 | end   = 67
 | speed = 40
}}

@@ خط ۱: / خط ۱: @@
-<div style="width:160px; border:1px solid #ccc; padding:10px; text-align:center; border-radius:8px; font-family:Tahoma;">
+<includeonly>
-   <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/3/3f/Icon_example.png/40px-Icon_example.png" alt="آیکن" style="margin-bottom:8px;" />
+<div class="mw-counter-box" style="width:160px; border:1px solid #ccc; padding:10px; text-align:center; border-radius:8px; font-family:Tahoma;">
-   <div style="font-weight:bold; font-size:16px;">تعداد آیتم‌ها</div>
+   <div class="mw-counter-icon" style="margin-bottom:8px;">
-   <div id="animated-counter" style="font-size:20px; color:#333; margin-top:6px;">1</div>
+    [[File:{{{icon|Example-icon.png}}}|40px]]
+  </div>
+   <div class="mw-counter-title" style="font-weight:bold; font-size:16px;">
+    {{{title|عنوان}}}
+  </div>
+   <div class="mw-counter-number"
+       data-start="{{{start|1}}}"
+       data-end="{{{end|67}}}"
+       data-speed="{{{speed|40}}}"
+       style="font-size:20px; color:#333; margin-top:6px;">{{{start|1}}}</div>
 </div>
+</includeonly>
-<script>
+<noinclude>
-  let count = 1;
+'''نحوه استفاده:'''
-  const max = 67;
+<pre>
-  const speed = 40; // سرعت شمارش (میلی‌ثانیه)
+{{کادر-شمارنده
-  const counter = document.getElementById("animated-counter");
+ | icon  = User-icon.png
+ | title = کاربران فعال
-  const interval = setInterval(() => {
+ | start = 1
-    count++;
+ | end   = 67
-    counter.textContent = count;
+ | speed = 40
-    if (count >= max) clearInterval(interval);
+}}
-  }, speed);
+</pre>
-</script>
+</noinclude>