HTML - Audio - تضمين الصوتيات

-

HTML 🔊 تضمين الصوتيات

تُستخدم الوسوم <audio> و <source> في HTML لتشغيل الملفات الصوتية على صفحات الويب.

✅ وسم <audio>

يُستخدم هذا الوسم لتضمين ملف صوتي، ويمكن للمستخدم التحكم في تشغيله من خلال واجهة المستخدم الخاصة بالمتصفح.

🔸 الصيغة الأساسية:


<audio controls>
  <source src="audio.mp3" type="audio/mpeg">
  <source src="audio.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

⬅ يتم توفير أكثر من تنسيق صوتي (مثل MP3 و OGG) لضمان التوافق مع جميع المتصفحات.

🎛 أهم الخصائص (Attributes):

  • controls: لعرض أدوات التحكم (تشغيل، إيقاف، مستوى الصوت...)
  • autoplay: لتشغيل الصوت تلقائيًا عند تحميل الصفحة.
  • loop: لإعادة تشغيل الصوت تلقائيًا بعد انتهائه.
  • muted: لكتم الصوت عند بداية التشغيل.
  • preload: يحدد ما إذا كان يجب تحميل الملف الصوتي مسبقًا (none, metadata, auto).

🧪 مثال باستخدام خصائص إضافية:


<audio controls autoplay loop muted preload="auto">
  <source src="sound.mp3" type="audio/mpeg">
  <source src="sound.ogg" type="audio/ogg">
  Your browser does not support the audio element.
</audio>

⬅ في هذا المثال، سيتم تشغيل الصوت تلقائيًا، ويُعاد بشكل مستمر، ويبدأ مكتومًا.

📌 ملاحظات:

  • استخدام <source> يوفر دعمًا لتنسيقات مختلفة.
  • ليعمل الصوت تلقائيًا في بعض المتصفحات، يجب أن يكون مكتومًا muted أو أن يتم تفعيل التشغيل التلقائي من إعدادات المتصفح.

تعليقات

إرسال تعليق

المشاركات الشائعة من هذه المدونة

C# - Arrays

-
C# - المصفوفات (Arrays) المصفوفة (Array) هي بنية بيانات تُستخدم لتخزين مجموعة من القيم من نفس النوع في مكان واحد بالذاكرة، ويتم الوصول إلى العناصر باستخدام رقم الفهرس (Index). 🔹 كيفية تعريف مصفوفة: // تعريف مصفوفة وتعيين قيم ابتدائية int[] numbers = { 1, 2, 3, 4, 5 }; // الوصول إلى العنصر الأول Console.WriteLine(numbers[0]); // النتيجة: 1 💡 ملاحظات: الفهرس يبدأ من 0، أي أول عنصر هو numbers[0] . يمكنك استخدام حلقة for أو foreach للتكرار على المصفوفة. يجب تحديد نوع البيانات التي ستحتويها المصفوفة. 🧪 مثال آخر: string[] fruits = new string[3]; fruits[0] = \"تفاح\"; fruits[1] = \"موز\"; fruits[2] = \"عنب\"; foreach (string fruit in fruits) { Console.WriteLine(fruit); } 📌 في هذا المثال، أنشأنا مصفوفة من ثلاث عناصر ومررنا عليها باستخدام foreach .
قراءة المزيد

Entity Framework - ما هو ORM؟ ونبذة عن Dapper وNHibernate

-
Entity Framework - ما هو ORM؟ ونبذة عن Dapper وNHibernate ORM هي اختصار لـ Object-Relational Mapping ، وتعني "الربط الكائني العلاقي". ببساطة، هي تقنية تُستخدم لربط الكائنات (Objects) في الكود مع الجداول (Tables) في قاعدة البيانات. 🔹 لماذا نحتاج إلى ORM؟ بدون ORM، نحتاج إلى كتابة استعلامات SQL يدوية والتعامل مع الكائنات بأنفسنا. بينما ORM توفر لنا طبقة وسيطة تقوم بتحويل الكود الكائني إلى استعلامات SQL تلقائيًا، والعكس أيضًا. 🔹 مزايا ORM تسريع التطوير. تقليل كمية الكود المكتوب. سهولة التعامل مع البيانات بشكل كائني. دعم التحقق من النوع (Type Checking) في وقت البرمجة. 🔹 عيوب ORM أداء أقل من SQL اليدوي في العمليات المعقدة. بعض المرونة تضيع بسبب التجريد العالي. 🔸 مقارنة بين EF Core وDapper وNHibernate التقنية النوع السهولة الأداء الدعم والانتشار Entity Framework Core ORM كامل سهل ومتكامل مع .NET متوسط مرتفع (مدعوم من Microsoft) ...
قراءة المزيد

Entity Framework - مقدمة عن Entity Framework

-
مقدمة عن Entity Framework 📜 لمحة تاريخية عن Entity Framework - أول إصدار من Entity Framework ظهر سنة 2008 كجزء من .NET Framework. - كان اسمه الرسمي ببساطة "Entity Framework"، ويعمل على ربط التطبيقات مع قواعد بيانات SQL بطريقة برمجية. - Entity Framework وفر وقتها أسلوبين رئيسيين للعمل: Database First ➔ إنشاء الكود انطلاقًا من قاعدة بيانات موجودة. Model First ➔ إنشاء قاعدة البيانات انطلاقًا من نموذج (Model) مرسوم. ✅ مع الوقت تطورت EF وتم إضافة أسلوب جديد يسمى Code First الذي أصبح من أكثر الطرق استخدامًا اليوم. 🔗 إصدارات Entity Framework قبل EF Core Entity Framework 1.0 (2008) - الإصدار الأول وكان محدود الإمكانيات. Entity Framework 4.0 (2010) - تحسينات كبيرة ودعم أفضل لـ POCO classes. Entity Framework 5.0 و6.0 (2012-2013) - دعم مميزات متقدمة مثل Migrations وتحسين الأداء. 💡 ملاحظة: لم يكن هناك EF 2.0 أو EF 3.0 رسميًا. 🚀 لماذا تم تطوير Entity Framework Core؟ مع ظهور .NET Core، احتاجت مايكروسوفت إلى نسخة خفيفة وعصرية م...
قراءة المزيد