مشغل فيديو وصوت احترافي
كود مشغل فيديو وصوت
مشغل الفيديو
يمكن استخدام plyr.js في أي منصه ، علي سبيل المثال نحن بصدد أستخدامه في منصة اب كربتور دعنا نتوغل بداخل الشرح لنفهم أكثر ،أولاً ننشئ صفحة html > تحرير html "، نقوم بالبحث عن <head> وتحت مباشرة نضع الكود التالي:
<link rel="stylesheet" href="https://cdn.plyr.io/3.5.1/plyr.css"/>
أخيرًا ، سنقوم بتضمين plyr.js أعلي الوسم </body> لتهيئة Plyr() ، نقوم بلصق الكود التالي:
<video class='js-player' poster="thumbnail.jpg" controls playsinline>
<source src="video.mp4" type="video/mp4">
</video>
نحن جاهزون ،قمنا بأضافة مشغل Plyr لكافة العناصر التي تنترج تحت .js-player ، والتي تتيح لنا أستخدام عدة مشغلات فيديو أو صوت في نفس الصفحة .
مشغل الصوت
واحدة من أهم المميزات في الإصدار 3.0 من Plyr ، هو أنه يسمح لنا الآن بالتحكم في سرعة االصوتيات ، ولكن للتحكم في الصوت عليك بوضع الكود النالي.
<audio class='js-player' controls>
<source src="audio.mp3" type="audio/mp3">
</audio>
يمكننا أيضا تحديد العديد من الصيغ. عادة ما تكون mp3 هي الأكثر دعمًا. فيما يتعلق بالجودة والوزن ، أوصي أيضاً بصيغة ogg ، حتى يتمكن المستعرض من أستخدام الأفضل بينهم:
<audio class='js-player' controls>
<source src="audio.mp3" type="audio/mp3">
<source src="audio.ogg" type="audio/ogg">
</audio>
