2023

كود html العد التنازلي لأي حدث بدون برنامج 2024 countdown timer

صورة
azzouni

كود html العد التنازلي بالعربي

كود html العد التنازلي بالعربي
كود html العد التنازلي بالعربي

كود HTML الوقت المتبقي على حدث معين

يبحث العديد من اصحاب المواقع او التطبيقات عن كود html لإنشاء عد تنازلي لحدث معين، حيث تعتبر هذه الاضافة من أفضل الأساليب الدعائية التشويقية التي تجعل من الحدث اكثر اهمية، وهي جزء من الدعاية الإستباقية و التشويقية، في هذا المقال تجد كود html جاهز كل ما عليك القيام به هو تغير التاريخ و الوقت (باللون الاحمر) الي تاريخ الحدث الخاص بك .


كود html اضافة عداد تنازلي بالأيام والثواني بدون برنامج خارجي

بعد تعديل التاريخ و الوقت ، قم بنسخ الكود و إضافته الى أي صفحة على موقعك على الويب.



<!--Display the countdown timer in an element-->
<p id="demo"></p>

<script>
// Set the date we're counting down to
var countDownDate = new Date("Apr 2, 2024 00:00:00").getTime();

// Update the count down every 1 second
var x = setInterval(function() {

  // Get today's date and time
  var now = new Date().getTime();

  // Find the distance between now and the count down date
  var distance = countDownDate - now;

  // Time calculations for days, hours, minutes and seconds
  var days = Math.floor(distance / (1000 * 60 * 60 * 24));
  var hours = Math.floor((distance % (1000 * 60 * 60 * 24)) / (1000 * 60 * 60));
  var minutes = Math.floor((distance % (1000 * 60 * 60)) / (1000 * 60));
  var seconds = Math.floor((distance % (1000 * 60)) / 1000);

  // Display the result in the element with id="demo"
  document.getElementById("demo").innerHTML = days + "   يوم   " + hours + "  ساعة   "
  + minutes + "  دقيقة  " + seconds + "  ثانية  ";

  // If the count down is finished, write some text
  if (distance < 0) {
    clearInterval(x);
    document.getElementById("demo").innerHTML = "EXPIRED";
  }
}, 1000);
</script>
  




ملاحظة: يجب تغير التاريخ و الوقت 
كما يمكنك تغير اسم ( اليوم ، الساعة، الدقائق، الثانية).


إقرأ أيضاً :

تعديل المقال
الأقسام

مقالات قد تهمك