أضف رسالة عند قطع الاتصال بالإنترنت

اذهب الى الأسفل

أضف رسالة عند قطع الاتصال بالإنترنت Empty أضف رسالة عند قطع الاتصال بالإنترنت

مُساهمة من طرف كونان2000 الجمعة 7 يونيو 2024 - 17:55

السلام عليكم ورحمة الله وبركاته 
مرحباً بجميع أعضاء احلى منتدى
أضف رسالة عند قطع الاتصال بالإنترنت Animat16
----------------------------------


تظهر الرسالة فور انقطاع اتصال الإنترنت فجأة، وتختفي الرسالة فور استعادة اتصال الإنترنت

قد ينقطع الاتصال قبل الانتهاء من كتابة المساهمة في المحرر، وقد يتم الضغط على زر الإرسال دون معرفة أن الاتصال قد انقطع.
وهذا ربما قد يسبب ازعاج لأعضاء المنتدى
ولذا قد يكون من المفيد عرض رسالة تنبيه للأعضاء في حالة فقدهم اتصالهم بالإنترنت أضف رسالة عند قطع الاتصال بالإنترنت Icon_biggrin
-----



طريقة التثبيت
__________




تثبيت JavaScript
--------------------------
العنوان: كما تريد
المكان: في جميع الصفحات

أضف كود Javascript
الكود:
window.addEventListener('DOMContentLoaded', function() {
  var messageElement = document.createElement('div');
  messageElement.id = 'connection-message';
  messageElement.innerHTML = 'أنتبه: تم قطع الاتصال بالإنترنت';
  messageElement.style.cssText = `
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
   background: #9f180f;
    color: #fffdeb;
    font-size: 24px;
    font-weight: bold;
    padding: 10px;
    text-align: center;
    z-index: 9999;
    display: none;
  `;
  document.body.appendChild(messageElement);
  function showMessage() {
    messageElement.style.display = 'block';
    messageElement.style.animation = 'slideIn 0.5s ease-in-out';
  }
  function hideMessage() {
    messageElement.style.animation = 'slideOut 0.5s ease-in-out';
    setTimeout(function() {
      messageElement.style.display = 'none';
    }, 500);
  }
  window.addEventListener('offline', showMessage);
  window.addEventListener('online', hideMessage);
  function animate(element, animationName) {
    element.style.animationName = animationName;
    setTimeout(function() {
      element.style.animationName = '';
    }, 1000);
  }
  var slideInAnimation = `
    from {
      transform: translateY(100%);
      opacity: 0;
    }
    to {
      transform: translateY(0);
      opacity: 1;
    }
  `;

  var slideOutAnimation = `
    from {
      transform: translateY(0);
      opacity: 1;
    }
    to {
      transform: translateY(100%);
      opacity: 0;
    }
  `;
  messageElement.addEventListener('animationstart', function() {
    if (messageElement.style.animationName === slideInAnimation) {
      animate(messageElement, slideOutAnimation);
    }
  });
});
لا تنسى الضغط على زر قدّم

يمكنك تعديل محتوى الرسالة وخلفيتها ولون النص من كود JavaScript
من خلال تعديل الجزء المشار اليه في الصورة التالية
أضف رسالة عند قطع الاتصال بالإنترنت Ocia_a21


وفي الختام. وفقكم الله جميعا


______________________________
تمت كتابة هذا البرنامج بواسطة كونان2000
باستخدام AI


-----------------------------------------------------------
أضف رسالة عند قطع الاتصال بالإنترنت 410 لا يتم المساعدة على الخاص!
كونان2000
كونان2000
اشراف عام المساعدة
اشراف عام المساعدة

ذكر
عدد المساهمات : 1392
معدل النشاط : 2971
السُمعة : 205

https://anime.forumperso.com/

ابوعلي البلقاوي و abigan يعجبهم هذا الموضوع

الرجوع الى أعلى الصفحة اذهب الى الأسفل

الرجوع الى أعلى الصفحة

- مواضيع مماثلة

 
صلاحيات هذا المنتدى:
لاتستطيع الرد على المواضيع في هذا المنتدى