المشاركات : 94
المواضيع 18
الإنتساب : Aug 2021
السمعة :
2
الشكر: 122
تم شكره 50 مرات في 48 مشاركات
السلام عليكم
اريد من الاخوه الاكارم ومن الاخ Amir_Alzubidy المحترم
كود جافا نافذه تخرج بعد وقت معين بدون تحديث الصفحه
المشاركات : 80
المواضيع 0
الإنتساب : Nov 2014
السمعة :
3
الشكر: 17171
تم شكره 13215 مرات في 909 مشاركات
عليكم السلام و رحمة الله و بركاته
انا افترضت توقيت زمني لمدة خمس ثواني لانبثاق النافذة
ايضاً وضعت لك تضمين في نفس الكود ان اردت تكرار ظهور نفس النافذة
يمكنك تعديل الكود بما شئت .
PHP كود : <!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>Popup</title>
<style> #overlay { display: none; position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,0.5); top: 0; left: 0; }
#popup { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 20px; border-radius: 10px; text-align: center; } </style> </head>
<body>
<div id="overlay"></div>
<div id="popup"> <h3>تنبيه</h3> <p>اهلا و سهلا بك</p> <button onclick="closePopup()">إغلاق</button> </div>
<script>
// يعمل مرة واحدة بعد 5 ثواني setTimeout(function () { document.getElementById("popup").style.display = "block"; document.getElementById("overlay").style.display = "block"; }, 5000);
// الكود الاحتياطي (مكرر كل 5 ثواني) // let popupInterval = setInterval(function () { // document.getElementById("popup").style.display = "block"; // document.getElementById("overlay").style.display = "block"; // }, 5000);
// إغلاق النافذة function closePopup() { document.getElementById("popup").style.display = "none"; document.getElementById("overlay").style.display = "none"; }
</script>
</body> </html></html>
المشاركات : 94
المواضيع 18
الإنتساب : Aug 2021
السمعة :
2
الشكر: 122
تم شكره 50 مرات في 48 مشاركات
لو فهمت قصدي
اريد كود تنبيه اوقات الصلاه بدون تحديث الصفحه
المشاركات : 80
المواضيع 0
الإنتساب : Nov 2014
السمعة :
3
الشكر: 17171
تم شكره 13215 مرات في 909 مشاركات
(28-03-26, 11:37 PM)nnnjk كتب : لو فهمت قصدي
اريد كود تنبيه اوقات الصلاه بدون تحديث الصفحه
عذراً ,
لم تتضح الصورة بعد
ماذا تقصد بدون تحديث الصفحه
هل تريد جميع مواقيت الصلوات المفروضة
ام تريد اظهار تنبيه فقط بتوقيت ما .
المشاركات : 94
المواضيع 18
الإنتساب : Aug 2021
السمعة :
2
الشكر: 122
تم شكره 50 مرات في 48 مشاركات
29-03-26, 12:05 AM
(آخر تعديل لهذه المشاركة : 29-03-26, 12:22 AM {2} بواسطة nnnjk.)
اجعله على سبيل المثال وقت صلاة الفجر فقط
يبدوا بحاجة كود php يقوم بتحويل وقت معين مثلا 03:15 الى عدد ثواني
المشاركات : 80
المواضيع 0
الإنتساب : Nov 2014
السمعة :
3
الشكر: 17171
تم شكره 13215 مرات في 909 مشاركات
(29-03-26, 12:05 AM)nnnjk كتب : اجعله على سبيل المثال وقت صلاة الفجر فقط
يبدوا بحاجة كود php يقوم بتحويل وقت معين مثلا 03:15 الى عدد ثواني
لا لا ليس هذاا المقصد
يمكن بالفعل اظهار التنبيه بوقت معين
لكن سؤالي حتى اللحظة هل تقصد بدون تحديث الصفحه
تريد تنفيذ التنبيه دون تشغيل المتصفح ؟
ام انك تقصد عدم تحديث الصفحة بكل ثانيه ضمن نفس التوقيت
PHP كود : <!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>تنبيه بمواقيت الصلاة</title> <style> #overlay { display: none; position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,0.5); top: 0; left: 0; } #popup { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 20px; border-radius: 10px; text-align: center; } #countdown { font-size: 18px; margin-top: 20px; text-align: center; } button { margin-top: 10px; } </style> </head> <body>
<div id="overlay"></div>
<div id="popup"> <h3>تنبيه صلاة الفجر</h3> <p>حان الآن موعد الصلاة</p> <button onclick="closePopup()">إغلاق</button> </div>
<div id="countdown"></div>
<script> const fajrTime = "03:15"; let shown = false;
function updateCountdown() { let now = new Date(); let [hour, minute] = fajrTime.split(":"); let fajrDate = new Date(); fajrDate.setHours(parseInt(hour)); fajrDate.setMinutes(parseInt(minute)); fajrDate.setSeconds(0); if (now > fajrDate) { fajrDate.setDate(fajrDate.getDate() + 1); } let diff = fajrDate - now; let hours = Math.floor(diff / 1000 / 60 / 60); let minutes = Math.floor((diff / 1000 / 60) % 60); document.getElementById("countdown").textContent = `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة`; }
function checkFajr() { let now = new Date(); let currentTime = now.getHours().toString().padStart(2,'0') + ":" + now.getMinutes().toString().padStart(2,'0'); if (currentTime === fajrTime && !shown) { document.getElementById("popup").style.display = "block"; document.getElementById("overlay").style.display = "block"; shown = true; } }
function closePopup() { document.getElementById("popup").style.display = "none"; document.getElementById("overlay").style.display = "none"; }
updateCountdown(); setInterval(() => { updateCountdown(); checkFajr(); }, 60000);
</script> </body> </html>
المشاركات : 94
المواضيع 18
الإنتساب : Aug 2021
السمعة :
2
الشكر: 122
تم شكره 50 مرات في 48 مشاركات
29-03-26, 01:24 AM
(آخر تعديل لهذه المشاركة : 29-03-26, 01:36 AM {2} بواسطة nnnjk.)
اقصد اظهار التنبيه بدون تحديث الصفحة يعني مثلا التنبيه الساعه 03:15 دخل الزائر الصفحة الساعه 03:12 بعد 3 دقائق من دخوله الصفحه يخرج التنبيه بدون ان يحدث الصفحه
لم يعمل الكود بارك الله فيك
المشاركات : 80
المواضيع 0
الإنتساب : Nov 2014
السمعة :
3
الشكر: 17171
تم شكره 13215 مرات في 909 مشاركات
(29-03-26, 01:24 AM)nnnjk كتب : اقصد اظهار التنبيه بدون تحديث الصفحة يعني مثلا التنبيه الساعه 03:15 دخل الزائر الصفحة الساعه 03:12 بعد 3 دقائق من دخوله الصفحه يخرج التنبيه بدون ان يحدث الصفحه
الحل: استخدام setTimeout ديناميكي بدلاً من setInterval
بحيث نحسب فارق التوقيت و نشغل التنبيه تلقائياً بعد هذا الفرق.
PHP كود : <!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>تنبيه صلاة الفجر</title> <style> #overlay { display: none; position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,0.5); top: 0; left: 0; } #popup { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 20px; border-radius: 10px; text-align: center; } #countdown { font-size: 18px; margin-top: 20px; text-align: center; } button { margin-top: 10px; } </style> </head> <body>
<div id="overlay"></div>
<div id="popup"> <h3>تنبيه صلاة الفجر</h3> <p>حان الآن وقت صلاة الفجر</p> <button onclick="closePopup()">إغلاق</button> </div>
<div id="countdown"></div>
<script> const fajrTime = "05:10";
function showPopup() { document.getElementById("popup").style.display = "block"; document.getElementById("overlay").style.display = "block"; }
function closePopup() { document.getElementById("popup").style.display = "none"; document.getElementById("overlay").style.display = "none"; }
function updateCountdown() { let now = new Date(); let [hour, minute] = fajrTime.split(":"); let fajrDate = new Date(); fajrDate.setHours(parseInt(hour)); fajrDate.setMinutes(parseInt(minute)); fajrDate.setSeconds(0); if (fajrDate < now) { fajrDate.setDate(fajrDate.getDate() + 1); } let diff = fajrDate - now; let hours = Math.floor(diff / 1000 / 60 / 60); let minutes = Math.floor((diff / 1000 / 60) % 60); let seconds = Math.floor((diff / 1000) % 60); document.getElementById("countdown").textContent = `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة، ${seconds} ثانية`; }
function scheduleFajr() { let now = new Date(); let [hour, minute] = fajrTime.split(":"); let fajrDate = new Date(); fajrDate.setHours(parseInt(hour)); fajrDate.setMinutes(parseInt(minute)); fajrDate.setSeconds(0); if (fajrDate < now) { fajrDate.setDate(fajrDate.getDate() + 1); } let diff = fajrDate - now; setTimeout(showPopup, diff); }
// تحديث العد التنازلي كل ثانية setInterval(updateCountdown, 1000);
scheduleFajr(); updateCountdown(); </script>
</body> </html>
المشاركات : 94
المواضيع 18
الإنتساب : Aug 2021
السمعة :
2
الشكر: 122
تم شكره 50 مرات في 48 مشاركات
عمل الكود بارك الله فيك
لاكن اريد ان يستمر التنبيه 5 دقائق مثلا
المشاركات : 80
المواضيع 0
الإنتساب : Nov 2014
السمعة :
3
الشكر: 17171
تم شكره 13215 مرات في 909 مشاركات
(29-03-26, 02:01 AM)nnnjk كتب : عمل الكود بارك الله فيك
لاكن اريد ان يستمر التنبيه 5 دقائق مثلا
PHP كود : <!DOCTYPE html> <html lang="ar"> <head> <meta charset="UTF-8"> <title>تنبيه صلاة الفجر</title> <style> #overlay { display: none; position: fixed; width: 100%; height: 100%; background: rgba(0,0,0,0.5); top: 0; left: 0; } #popup { display: none; position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); background: #fff; padding: 20px; border-radius: 10px; text-align: center; } #countdown { font-size: 18px; margin-top: 20px; text-align: center; } button { margin-top: 10px; } </style> </head> <body> <div id="overlay"></div> <div id="popup"> <h3>تنبيه صلاة الفجر</h3> <p>حان الآن وقت صلاة الفجر</p> <button onclick="closePopup()">إغلاق</button> </div> <div id="countdown"></div> <script> const fajrTime = "05:10";
// هنا يمكنك تغيير مدة استمرار التنبيه
function showPopup() { document.getElementById("popup").style.display = "block"; document.getElementById("overlay").style.display = "block"; setTimeout(closePopup, 5 * 60 * 1000); }
function closePopup() { document.getElementById("popup").style.display = "none"; document.getElementById("overlay").style.display = "none"; } function updateCountdown() { let now = new Date(); let [hour, minute] = fajrTime.split(":"); let fajrDate = new Date(); fajrDate.setHours(parseInt(hour)); fajrDate.setMinutes(parseInt(minute)); fajrDate.setSeconds(0); if (fajrDate < now) { fajrDate.setDate(fajrDate.getDate() + 1); } let diff = fajrDate - now; let hours = Math.floor(diff / 1000 / 60 / 60); let minutes = Math.floor((diff / 1000 / 60) % 60); let seconds = Math.floor((diff / 1000) % 60); document.getElementById("countdown").textContent = `الوقت المتبقي لصلاة الفجر: ${hours} ساعة، ${minutes} دقيقة، ${seconds} ثانية`; } function scheduleFajr() { let now = new Date(); let [hour, minute] = fajrTime.split(":"); let fajrDate = new Date(); fajrDate.setHours(parseInt(hour)); fajrDate.setMinutes(parseInt(minute)); fajrDate.setSeconds(0); if (fajrDate < now) { fajrDate.setDate(fajrDate.getDate() + 1); } let diff = fajrDate - now; setTimeout(showPopup, diff); } setInterval(updateCountdown, 1000); scheduleFajr(); updateCountdown(); </script> </body> </html>
|