Yasmeen Hassan

10 أبريل 2022

اريد ان يكون بعد الضغط على الزر تبدأ الحركة التالية ؟

<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width">
  <title>replit</title>
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body>

  <body>
    <input type="checkbox" id="c">
    <label for="c" id="upload_app">
      
      <div id="app">
        <div id="arrow"></div>
        <div id="success">
          <i class="fas fa-check-circle"></i>
        </div>
      </div>



      <div class="circle">
        <div></div>
        <div></div>
        <div></div>
        <div></div>
        <div></div>
      </div>


    </label>

  </body>

</body>

</html>

html,
body {
  height: 100%;
}

body {
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  margin: 0;
  background-color: #f1f2f3;
}

#c {
  display: none;
}

#upload_app {
  display: block;
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  margin: 0 auto;
  width: 120px;
  height: 42px;
  transform: translateY(-50%);
  transition: 0.3s ease width;
  cursor: pointer;
}

#app {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-color: #fff;
  border: 2px solid #143240;
  overflow: hidden;
  z-index: 2;
}

#app:before {
  content: "Upload";
  position: absolute;
  top: 0;
  right: 0;
  padding: 12px;
  left: 0;
  color: #143240;
  font-size: 14px;
  line-height: 14px;
  font-weight: bold;
  z-index: 1;
}

arrow {
  position: absolute;
  top: 0;
  right: 0;
  width: 38px;
  height: 38px;
  background-color: #fff;
  z-index: 2;
}

#arrow:before,
#arrow:after {
  content: "";
  position: absolute;
  top: 18px;
  width: 10px;
  height: 2px;
  background-color: #143240;
}

#arrow:before {
  right: 17px;
  transform: rotateZ(-45deg);
}

#arrow:after {
  right: 11px;
  transform: rotateZ(45deg);
}

#success {
  position: absolute;
  top: 0;
  right: 0;
  width: 54px;
  height: 54px;
  margin: -8px;
  background-color: #143240;
  transform: scale(0);
  border-radius: 50%;
  z-index: 3;
}

#success i {
  font-size: 20px;
  color: #fff;
  display: block;
  width: 20px;
  height: 20px;
  margin: 17px auto;
  transform: scale(0);
}

#c:checked + #upload_app {
  width: 42px;
}

#c:checked + #upload_app #arrow:before {
  animation: _a 0.4s ease 0.4s forwards, _incHeight 4s ease 1s forwards;
}

#c:checked + #upload_app #arrow:after {
  animation: _b 0.4s ease 0.4s forwards, _incHeight 4s ease 1s forwards;
}

#c:checked + #upload_app #success {
  animation: _success 0.4s cubic-bezier(0, 0.74, 0.32, 1.21) 5s forwards;
}

#c:checked + #upload_app #success i {
  animation: _success 0.3s cubic-bezier(0, 0.74, 0.32, 1.21) 5.2s forwards;
}

@keyframes _a {
  0% {
    top: 18px;
    right: 17px;
    width: 10px;
    transform: rotateZ(-45deg);
    background-color: #143240;
  }
  100% {
    top: 36px;
    right: 19px;
    width: 19px;
    transform: rotateZ(0deg);
    background-color: #ffc107;
  }
}

@keyframes _b {
  0% {
    top: 18px;
    right: 11px;
    width: 10px;
    transform: rotateZ(45deg);
    background-color: #143240;
  }
  100% {
    top: 36px;
    right: 0;
    width: 19px;
    transform: rotateZ(0deg);
    background-color: #ffc107;
  }
}

@keyframes _incHeight {
  0% {
    top: 36px;
    height: 2px;
  }
  25% {
    top: 31px;
    height: 8px;
  }
  50% {
    top: 21px;
    height: 18px;
  }
  80% {
    top: 11px;
    height: 28px;
  }
  100% {
    top: 0;
    height: 39px;
  }
}

@keyframes _success {
  0% {
    transform: scale(0);
  }
  100% {
    transform: scale(1);
  }
}
/*-------------------------------*/
.circle {
    
    position: absolute;
    top: 0;
    left: 0;
    width: 100vw;
    height: 100vh;
    background: #3a6e9a;
    background-size:contain ;
  }
  
  .circle div {
    position: absolute;
    top: calc((50% - 10px)); /* تبع موقع الدايرة من الصفحة كاملة الي بالبكسل غير مهمة*/
    left: calc((50% - 10px));
    width: 20px;
    height:20px;
    border-radius: 50%;/*هذا والاثنين الي فوقة مقاييس تبع الدايرة*/
    background: #fff;
   
  }
  /*السرعات لي الدوائر*/
  .circle-anim div:nth-child(1) { animation: anim_01 5s forwards;}
  .circle-anim div:nth-child(2) { animation: move_01 5s 2s; }
  .circle-anim div:nth-child(4) { animation: move_03 5s 2s; }
  .circle-anim div:nth-child(3) { animation: move_02 5s 2s; }
  .circle-anim div:nth-child(5) { animation: move_04 5s 2s; }
  
  @keyframes anim_01 {
    0% {   transform: scale(0);}/*الدائرة لمن تصغر*/
    20% {  transform: scale(5);} /*الدائرة لمن تكبر*/
    50% {  transform: scale(3);}/*الدائرة لمن تصغر*/
    90% {  transform: scale(5);}/*الدائرة لمن تكبر*/
    100% { transform: scale(0);}/*الدائرة لمن تصغر*/
  }
  
  @keyframes move_01 {
    0% {   transform: translate(0) scale(0);} /* غير متاكدة حجم الدائرة لمن تخرج من الوسط*/
    /* انتقال الدوائر الصغير ف الارباع المختلفة*/
    20% {  transform: translate(-100px, -100px) scale(1);}
    40% {  transform: translate(-100px, 100px) scale(1);}
    60% {  transform: translate(100px, 100px) scale(1);}
    80% {  transform: translate(100px, -100px) scale(1);}
    100% { transform: translate(0) scale(1);}
  }
  
  @keyframes move_02 {
    0% {   transform: translate(0) scale(0);}
    20% {  transform: translate(-100px, 100px) scale(1);}
    40% {  transform: translate(100px, 100px) scale(1);}
    60% {  transform: translate(100px, -100px) scale(1);}
    80% {  transform: translate(-100px, -100px) scale(1);}
    100% { transform: translate(0) scale(1);}
  }
  
  @keyframes move_03 {
    0% {   transform: translate(0px) scale(0);}
    20% {  transform: translate(100px, 100px) scale(1);}
    40% {  transform: translate(100px, -100px) scale(1);}
    60% {  transform: translate(-100px, -100px) scale(1);}
    80% {  transform: translate(-100px, 100px) scale(1);}
    100% { transform: translate(0) scale(1);}
  }
  
  @keyframes move_04 {
    0% {   transform: translate(0px) scale(0);}
    20% {  transform: translate(100px, -100px) scale(1);}
    40% {  transform: translate(-100px, -100px) scale(1);}
    60% {  transform: translate(-100px, 100px) scale(1);}
    80% {  transform: translate(100px, 100px) scale(1);}
    100% { transform: translate(0) scale(1);}
  }

مجلد 1.docx

26 مارس 2022

اريد المساعدة في التأكد من الاسطر التي باللون الاصفر , وكيفية تصحيحها ؟

<?xml version="1.0"?>
<function>
  <title>ctime</title>
  <funcsynopsis>
    <funcdef>
      <function>ctime</fnuction>
    </funcdef>
    <paramdef>
      <parameter>time</parameter>
      <parameter role="opt">gmt</parameter>
    </paramdef>
  </funcsynopsis>
  <para>This function converts the value 
    <parameter> time < /parameter>,as returned by         <function>time()</function>
      <function>file_mtime()</function>, into a string of the form produced by <function>time_date()</function>.
      If the optional argument <parameter>gmt</parameter> is specified and non-zero,the time is returned in <parameter>gmt</parameter>.
      Otherwise, the time is given in the local time zone.
      </para>
      <para><emphasis role="strong" targetgroup="beginners" role="strong">
        Related topics</emphasis>
      </para>
      <para>&ampdoubleclick; the <mousebutton>LEFT    &ampbuttonleft;</mousebutton>
        mouse button on a topic 
      </para>
      <itemizedlist>
        <listitem>
          <para><ulink url="&ampidhelp782;"><function>file_mtime()</function>built-in function</ulink>
          </para>
        </listitem>
        <listitem>
          <para><ulink url="&ampidhelp785;"><function>time()</function> built-infunction</ulink>
          </para>
        </listitem>
      </itemizedlist>
      </function>

XML.docx

8 أبريل 2021

انا عملت صفحة تسجيل دخول ولكنها مربوطة بقاعدة بيانات , فأريد التعديل وجعلها تشتغل ولكن بدون ربطها بقاعدة البيانات

هل هذا ممكن؟

last.rar

4 أبريل 2021

شكراً جزاك الله خير ، اشتغل معايا .

4 أبريل 2021

ماذا استخدم لجعل رسالة( تم تسجيل الدخول) كأشعار؟

مثل هذا

4 أبريل 2021

عدلت لكن لم يتغير شيء

last.rar

4 أبريل 2021

4 أبريل 2021

جربت متصفح اخر وزبط معايا , شكرا مررره اسعدتني بمساعدتك .

4 أبريل 2021

ارفق ليا الملف تبعك وبجرب

4 أبريل 2021

ctrl + f5 حدثت لكن لمن يتغير شيء

last.rar

4 أبريل 2021

4 أبريل 2021

تمام اشتغل معايا لكن عند وضع css لكلاس error لم يتم التنفيذ

4 أبريل 2021

تمام اتعدل معايا اصبح يظهر الخطأ

لكن هذا ماذا يعني

Warning: Undefined array key "password_1" in C:\xampp\htdocs\last\server.php on line 15

Warning: Undefined array key "password_2" in C:\xampp\htdocs\last\server.php on line 16

4 أبريل 2021

طلع غلط اخر اذا ممكن ضع التعديلات على ملفي وارسلها ؟

هذا الخطأ الذي ظهر

Fatal error: Uncaught ArgumentCountError: mysqli_real_escape_string() expects exactly 2 arguments, 1 given in C:\xampp\htdocs\last\server.php:10 Stack trace: #0 C:\xampp\htdocs\last\server.php(10): mysqli_real_escape_string('') #1 C:\xampp\htdocs\last\rag.php(1): include('C:\\xampp\\htdocs...') #2 {main} thrown in C:\xampp\htdocs\last\server.php on line 10

4 أبريل 2021

بتاريخ 6 دقائق مضت قال بلال زيادة:
يجب إضافة
method="POST"
إلى form فيصبح
<form class="post" action="rag.php" method="POST">
فستظهر معك الأخطاء لانه في ملف server.php قمنا بوضع هذا الشرط
if(isset($_POST['register'])){
أي أنه يتحقق أنه هناك قيمة تم إرسالها بإستخدام POST.

عدلت على ال form لكن عند الضغط على register

يظهر هذا الخطأ

Fatal error: Uncaught Error: Call to undefined function mysql_real_escape_string() in C:\xampp\htdocs\last\server.php:10

4 أبريل 2021

انا لم اكمل الخطوات تبعا لهذا الفديو

توقفت عند صفحة ال error الدقيقة 15 لان زي ماقلت ماطلعت معايا

last.zip

3 أبريل 2021

اتبعت خطوات لكتابة كود ال php ولكن واجهتني مشكلة في عدم اظهار اخطاء التسجيل

ريادة الأعمال

البرمجة

التصميم

DevOps

التسويق والمبيعات

العمل الحر

البرامج والتطبيقات

آخر التحديثات

قصص نجاح

أسئلة وأجوبة

كتب

دورات

أجوبة بواسطة Yasmeen Hassan