اذهب إلى المحتوى

البرمجة

اعرض جميع التصنيفات

فهم الأحداث في جافاسكربت

بواسطة أسامة عبد الهادي، في جافاسكربت، ‏

في سلسلة فهم شجرة DOM، ناقشنا شجرة DOM وكيفية الوصول والتنقل وإضافة وإزالة وتعديل العقد والعناصر باستخدام وحدة تحكّم أدوات المطوّر. table { width: 100%; } thead { vertical-align: middle; text-align: cen…

خاصيات الحركات

بواسطة محمد بغات، في CSS، ‏

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

دليلك إلى استعمال الأداة Lighthouse

بواسطة جميل بيلوني، في سير العمل، ‏

Lighthouse هو أداة مُؤَتمتة (Automated) مفتوحة المصدر لتحسين صفحات الويب. يمكن تطبيق الأداة على أي صفحة ويب سواء كانت عامّة أو تحتاج للاستيثاق (Authentication). يمكن استخدام الأداة للتدقيق في الأداء، قابليّة الوصول (Accessibi…

تطبيق عملي: التحريكات

بواسطة محمد بغات، في CSS، ‏

ألقينا في المقالات الماضية نظرة على الخاصية transition، وسنلقي في هذه المقالة نظرة أعمق على الخاصية animation. هذه المقالة جزء من سلسلة من المقالات حول التحريك في CSS: ما هي استخدامات الحركات؟ تجهيز بيئة ال…

دليلك إلى منهجية BEM

بواسطة سجى الحاج، في CSS، ‏

هذا المقال تمت كتابته بتعاون بين Joe Richardson و Robin Rendle ومجموعة من فريق موقع CSS-Tricks. أراد Joe إضافة مقال بخصوص BEM التي أحببناها وكان لدى كل منا أفكارًا وآراءً حولها، لذلك قررنا أن نتعاون سويًا لكتابة هذا المقال. …

الانتقالات وجافاسكربت

بواسطة محمد بغات، في CSS، ‏

استخدمنا في المقالات السابقة الخاصية transition للقيام بالتحريك بين حالتين، حالة عدم التحويم (non-hover state) وحالة التحويم (hover state). تحدُث تلك الانتقالات عند التحويم (تمرير مؤشر الفأرة) فوق العنصر. بيْد أنّ هذه لي…

تعديل الخاصيات والأصناف والأنماط في شجرة DOM

بواسطة أسامة عبد الهادي، في جافاسكربت، ‏

تعلمنا فيما سبق في هذه السلسلة "كيف تجري تغيرات على شجرة DOM" والتعامل مع شجرة DOM من إنشاء، وإدراج، واستبدال وإزالة عناصر من المستند بتوابع مضمنة. أصبحت الآن مؤهلًا لاستخدام قدرات JavaScript التفاعلية وتعديل عناصر الويب لبزي…

الانتقالات المتعددة

بواسطة محمد بغات، في CSS، ‏

لقد ناقشنا في المقالات السابقة كيف يخلق الانتقال (transition) الحركة عبر الانتقال من حالة إلى أخرى. في هذه المقالة سنرى ما يحدث عندما نطبق عملية انتقال واحدة على عنصر واحد تحدث له عدة تغييرات، وكيفية استخدام عدة انتقالات معًا…

إعداد صور متجاوبة

بواسطة سجى الحاج، في HTML، ‏

المرة الأولى التي صنعت فيها صورة متجاوبة (responsive)، كانت بسيطة مثل ترميز هذه الأسطر الأربعة. img { max-width: 100%; height auto; /* default */ } رغم أن ذلك كان مناسبًا لي كمطور، إلا أنه لم يكن الأفضل للمستخدمين.…

الضغط النشط باستخدام GZIP

بواسطة Rama Alkhayer، في مقالات برمجة عامة، ‏

يُخفّض الضّغط من أوقات الاستجابة من خلال تقليص حجم استجابة HTTP. يُعدُّ Gzip طريقةَ الضّغط الأكثر شيوعًا وفعاليّةً في الوقت الحاضر و عادةً ما يُقلّص حجم الاستجابة بما يقارب 70%. في عام 2009، كانت 90% من حركة البيانات على…

دوال التوقيت

بواسطة محمد بغات، في CSS، ‏

دالة التوقيت (timing function) تتحكم في وتيرة وسرعة التغيرات التي تحدث إبّان الانتقال (transition). باستخدام دوال التوقيت، يمكن جعل الانتقالات أكثر حيوية. هذه المقالة جزء من سلسلة من المقالات حول التحريك في CSS: م…

خاصيات الانتقالات

بواسطة محمد بغات، في CSS، ‏

تعلّمنا في المقالة الماضية كيفية عمل الخاصية transition، وسنلقي في هذه المقالة نظرة على خاصيات الانتقالات. هذه المقالة جزء من سلسلة من المقالات حول التحريك في CSS: ما هي استخدامات الحركات؟ تجهيز بيئة العمل …

التحويل بين الأنواع

بواسطة نور أحمد آغا، في جافاسكربت، ‏

تُحوِّل الدوال والمعاملات، في أغلب الأحيان، القيم التي تصلها إلى النوع الذي يناسبها وهذا ما يسمى «تحويل النوع». تُحوِّل الدالة alert مثلًا أي قيمة إلى سلسلة نصية تلقائيًا لإظهارها، وتُحوِّل والعمليات الرياضية القيم التي تستعم…
أنا متأكد تمامًا من أنك تفهم أهمية قائمة التنقل في موقع الويب وارتباطها بمشاركة الموقع فيما يلي عشر نصائح لجعل تجربة المستخدم UX سلسلة وأكثر قابلية للاستخدام. تعد إمكانية التنقل داخل موقعك جزءًا مهمًا لأي موقع ويب من أيً…

تطبيق عملي: الانتقالات

بواسطة محمد بغات، في CSS، ‏

الآن وبعد أن قدمنا الخاصيتين transition و animation، فقد حان الوقت للتعمق أكثر في الانتقالات (transitions)، ومطالعة بعض الأمثلة. هذه المقالة جزء من سلسلة من المقالات حول التحريك في CSS: ما هي استخدامات الحركات؟ …

أنواع البيانات

بواسطة نور أحمد آغا، في جافاسكربت، ‏

يمكن أن يحتوي المتغير على أي نوع من أنواع البيانات في JavaScript. أي من الممكن أن يكون متغير من نوع سلسلة نصية في وقت ما، ثم يتغير محتواه إلى قيمة عددية وهكذا دواليك. // لا يوجد أي خطأ let message = "hello"; message = 123…

مدخل إلى الحركات: مفهوم الحركة

بواسطة محمد بغات، في CSS، ‏

لقد ناقشنا في المقالات السابقة استخدامات وفوائد التحريك (Animation)، ووجدنا بعض مصادر الإلهام، وألقينا نظرة على الأدوات والمواقع التي قد تكون مفيدة في التطوير، وتعرّفنا على كيفية تطبيق حركة عبر نقل عنصر من حالة إلى أخرى (tran…

المتغيرات

بواسطة نور أحمد آغا، في جافاسكربت، ‏

سوف تحتاج، بالتأكيد، في مرحلة ما من عملك على تطوير التطبيقات في لغة JavaScript للتعامل مع المعلومات. فمثلًا، بإمكانك تخيل العمل على التطبيقين التاليين: متجر إلكتروني – يمكن أن تتضمن المعلومات البضائع التي تباع وسلة الت…
يمثّل كلٌّ من الضّغط والتّصغيرأمرًا تقوم بتنفيذه على الأصول الموجودة في موقعك (مثل ملفات css. وملفات js.). تستطيع من خلال كِلَيهما تقليص حجم الملف وبالتّالي جعلَه أكثر فعاليّةً في عبور الشبكة بين الخواديم والمتصفّحات. بكلمات …
سنلقي في هذه الفقرة نظرة على خاصية الانتقال transition. هذه المقالة جزء من سلسلة من المقالات حول التحريك في CSS: ما هي استخدامات الحركات؟ تجهيز بيئة العمل لإنشاء الحركات مدخل إلى الانتقالات: التنقل ب…
×
×
  • أضف...