كود نافذة دعائية متحركة

في هذا المقال، سنتحدث عن كود يسمح بإنشاء نافذة دعائية متحركة. سنستكشف كيفية استخدام لغات الويب المختلفة مثل HTML وCSS وJavaScript لتحقيق هذه النافذة المتحركة.

سنقدم لك الأكواد اللازمة لإنشاء النافذة وتحديد مظهرها وتحريكها باستخدام CSS وJavaScript. سنستخدم خصائص CSS لتحديد الحجم والشكل والألوان للنافذة وتنسيق المحتوى الداخلي بها. ثم سنستخدم البرمجة بلغة JavaScript لتحريك النافذة وإضافة تأثيرات حركة إليها.

سنقدم لك أمثلة وشرحًا مفصلاً للأكواد لتوضيح عملية إنشاء النافذة الدعائية المتحركة. سنركز على استخدام خصائص CSS المناسبة لتحريك النافذة وتحقيق التأثيرات المطلوبة مثل التحرك الأفقي أو الرأسي أو الدوران.

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

للحصول على هذا الكود :

<html>
<head>
  <script type="text/javascript">
    var popUp = 0;
    var popURL = 0;
    var popWidth = 0;
    var popHeight = 0;

var thisMargin = 10;

var popTopPosition = thisMargin;
    var popLeftPosition = thisMargin;

var pause = 20;
    var step = 10; // كل ما زاد الرقم، زادت سرعة النافذة
    var timer = 0;

var screenWidth = 0;
    var screenHeight = 0;

var endX = 0;
    var endY = 0;

function startPop(thisurl, thiswidth, thisheight) {
      popURL = thisurl;
      popWidth = thiswidth;
      popHeight = thisheight;

popUp = window.open(
        popURL,
        "traveler",
        "toolbar=no,width=" +
          popWidth +
          ",height=" +
          popHeight +
          ",top=" +
          popTopPosition +
          ",left=" +
          popLeftPosition
      );

screenWidth = window.screen.width;
      screenHeight = window.screen.height;
      endX = screenWidth - thiswidth - thisMargin;
      endY = screenHeight - thisheight - thisMargin;
      movedown();
    }

startPop("https://www.nasr.app/p/important-tools-for-everyone.html", "300", "200"); // ضع رابط البانر هنا
  </script>
</head>
<body>
  <h1></h1>
  
</body>
</html>

موقع النصر التقنى

كود نافذة دعائية متحركة

للحصول على هذا الكود :

مهندس محمد نصر