محمود_سعداوي

نعم قمت بها و لكن دون جدوى

قمت أيضا بإضافة الأمر git pull --rebase origin master النتيجة:

لاشيء تغير

السلام عليكم. الصورة التالية تبين أن الملف قد تم رفعه على github. لكن على github لا يوجد شيء داخل الملف. https://github.com/Saadaoui-Forkan/webAgency.git الرجاء المساعدة. شكرا.

شكرا. this في arrow function تأتي من المحتوى التي هي ضمنه. لذلك لم يقع التعرف على this. وبالتالي يصبح الحل: const btn1 = document.querySelector(".btn1") btn1.addEventListener('click', test) function test(){ this.style.display = 'none' }

الرجاء توضيح الخطأ عند إستعمال الكود التالي const btn1 = document.querySelector(".btn1") btn1.addEventListener('click', ()=>{ test() }) const test = () => { return this.style.display='none' }

السلام عليكم. لما أفتح ملف الذي أعمل عليه بواسطة vs code تظهر لي العلامة التالية U. لماذا تظهر هذه العلامة و كيف يمكن معالجتها. شكرا.

السلام عليكم. في الكود التالي let arr = ["ahmed","mohamed","mahmoud","ali","omar"] const btn = document.querySelector('button') function sayHello() { let i=0 btn.addEventListener('click', ()=>{ console.log(`Hello I'm ${arr[i]}`) i++ }) } setTimeout(sayHello,3000) عندما أضغط على الزر تظهر الرسالة مباشرة و ليس بعد 3 ثواني. الرجاء المساعدة و شكرا.

في الكود التالي قيمة b في الحالتين تساوي 0. الرجاء التوضيح. الكود: let a = true let b = 0 if (a) { b === 1 console.log(b); } console.log(b)

عند تعلم الجافا سكريبت من الضرورة التطرق إلى الBOM و لكن عند البدء باستخدام react هل يقع الاستغناء عن BOM أم أن hooks ستكون بديلا عنها. شكرا.

شكرا. أنا فقط أردت القيام بنفس ما تقوم به components في react js.

السلام عليكم. لنفترض أني قمت بإنشاء صفحة ويب كاملة تحتوي على index.html و style.css و script.js. في نفس الوقت قمت بإنجاز ملف آخر لنفترض contact. هذا الملف هو أيضا يحتوي على contact.html contact.css contact.js. سؤالي كيف يمكن ربط هذا الملف contact بindex.html. شكرا.

*, ::after, ::before{ margin: 0; padding: 0; box-sizing: border-box; outline: none; list-style: none; } نعم بالتأكيد. قبل بداية تنسيق العناصر دائما أكتب الكود النالي *, ::after, ::before{ margin: 0; padding: 0; box-sizing: border-box; outline: none; list-style: none; }

تفضل كود css .section-2{ overflow: hidden; background-color: #222020; } .parag-wrapper{ margin: 50px auto; max-width: 310px; height: auto; color: #fff; position: relative; } .parag-wrapper i{ font-size: 20px; } .parag-wrapper .fa-quote-right{ position: absolute; right: 0; } .parag-wrapper p{ margin: 10px auto; font-size: 18px; text-align: justify; font-family: 'Oswald', sans-serif; } .parag-wrapper p::after{ content: ""; position: absolute; width: 90%; height: 2px; background-color: #fff; top: 5%; right: 0; } .parag-wrapper p::before{ content: ""; position: absolute; width: 90%; height: 2px; background-color: #fff; bottom: -9%; left: 0; } /* end of section-2 */ /* section 3 ==> Pricing */ /* #222020 */ .section-3{ background-color: #03070e; margin-top:0; } .pricing-cards-wrapper{ display: flex; flex-direction: column; align-items: center; } كود html <section class="section-2"> <h1 class="section-heading">About Us</h1> <div class="parag-wrapper"> <i class="fa-solid fa-quote-left"></i> <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Tempora totam nam quasi officia, voluptatum deleniti provident natus temporibus molestiae quae ratione fugit placeat voluptatibus, deserunt repellat dicta, optio quo quisquam libero tempore veritatis? Veritatis nam magnam omnis nobis iusto recusandae minus odit eligendi maxime dolorem, eos id! Fugiat, adipisci perspiciatis!</p> <i class="fa-solid fa-quote-right"></i> </div> </section> <!-- end of section-2 --> <!-- section 3 ==> Pricing --> <section class="section-3"> <h1 class="section-heading">Pricing</h1> <div class="pricing-cards-wrapper"> <div class="pricing-card"> <div class="pricing-card-front"> <h2 class="pricing-card-heading">Free</h2> <h3 class="pricing-card-price">$0</h3> <ul class="pricing-card-list free-list"> <li> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> </li> </ul> <button class="pricing-card-btn btn-free" type="button"> CHOOSE PLAN </button> </div> <div class="back-free pricing-card-back"> <a href="#">Order Now</a> </div> </div> <div class="pricing-card"> <div class="pricing-card-front"> <h2 class="pricing-card-heading">Basic</h2> <h3 class="pricing-card-price">$299</h3> <ul class="pricing-card-list basic-list"> <li> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> </li> </ul> <button class="pricing-card-btn btn-basic" type="button"> CHOOSE PLAN </button> </div> <div class="back-basic pricing-card-back"> <a href="#">Order Now</a> </div> </div> <div class="pricing-card"> <div class="pricing-card-front"> <h2 class="pricing-card-heading">Standard</h2> <h3 class="pricing-card-price">$699</h3> <ul class="pricing-card-list standard-list"> <li> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-xmark"></i> <span>Lorem ipsum dolor</span> </li> </ul> <button class="pricing-card-btn btn-standard" type="button"> CHOOSE PLAN </button> </div> <div class="back-standard pricing-card-back"> <a href="#">Order Now</a> </div> </div> <div class="pricing-card"> <div class="pricing-card-front"> <h2 class="pricing-card-heading">Premium</h2> <h3 class="pricing-card-price">$999</h3> <ul class="pricing-card-list premium-list"> <li> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> <i class="fa-solid fa-check"></i> <span>Lorem ipsum dolor</span> </li> </ul> <button class="pricing-card-btn btn-premium" type="button"> CHOOSE PLAN </button> </div> <div class="back-premium pricing-card-back"> <a href="#">Order Now</a> </div> </div> </div> </section> <!-- end of section 3 -->

يوجد حل في وضع قيمة سالبة ل margin-top و لكن هذا لديه تأثير سالب عند جعل الموقع responsive

السلام عليكم ما سبب وجود الفراغ بالأبيض بين 'two sections' علما و أني وضعت margin-top = 0 للعنصر الأسفل شكرا.

تظهر رسالة الخطأ التالية عند تطوير الموضع.

أنا أيضا قمت بإخراج .video-wrapper من الملف الحالي و العمل عليها داخل ملف آخر لوحدها و لم أجد أي مشكل. لم أدر ما السبب. شكرا للمساعدة.

ممكن أرسل الملف كاملا لأنه مشروع متكامل Web Agency.zip

الكود تارة يعمل و تارة لا

لم يقم بالطباعة و console لم يظهر أي خطأ

لا للأسف ممكن يكون مشكل بسبب css

السلام عليكم. مشكلة جافاسكربت - عرض معلومات فيديو عند النقر عليه لماذا الكود التالي لايعمل علما و أنّ console لايظهر أي خطأ عند الضغط على العنصر المحدد const video = document.querySelector('.video-wrapper video') video.addEventListener('click', ()=>{ console.log(video); }) شيفرة html <div class="video-wrapper"> <video src="./images/about-us.mp4" poster="images/about.jpg"></video> شكرا

السلام عليكم. في المثال التالي لدي مشكل في إستعمال خاصية hover ما أريد القيام به هو تفعيل خاصية الhover عند وضع الماوس على الأيقونة التي باللون الأخضر (يعني عند وضع الماوس على اللون الأخضر تظهر أيقونة اللون الأزرق) إستعملت الكود التالي .volume-icon:hover .volume-progress{ transform: scale(1); } هذا الكود لم يفعّل. ملاحظة: وقع تفعيل خاصية hover فقط عند وضع الماوس على العنصر الأب أي الأيقونة التي باللون الأحمر (يعني عند وضع الماوس على اللون الأحمر تظهر أيقونة اللون الأزرق) الكود .volume-voice:hover .volume-progress{ transform: scale(1); } الرجاء المساعدة (ما أريده هو عند وضع الماوس على أيقونة اللون الأخضر تظهر أيقونة اللون الأزرق) شكرا.