Құжаттама бөлімдері
Іздеу⌘KСайттағы фон: код және сілтемелер
Embedding қойындысында сайтқа арналған дайын HTML блогы және сайт құрастырғыштарына арналған ойнатқыш беті бар.
Сайтқа арналған код
Постері және мәтін астында қараңғы қабаты бар толық енді бейне блогы. Copy басып, бетіңізге қойыңыз да, түсініктемені өз мазмұныңызбен алмастырыңыз:
html
<style>
.bg-video { position: relative; overflow: hidden; min-height: 60vh; }
.bg-video > video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.bg-video::after { content: ""; position: absolute; inset: 0; background: rgba(0, 0, 0, .4); }
.bg-video__content { position: relative; z-index: 1; color: #fff; }
</style>
<div class="bg-video">
<video autoplay muted loop playsinline poster="https://stream.dodocast.com/bgv/code.jpg">
<source src="https://stream.dodocast.com/bgv/code-mobile.mp4" type="video/mp4" media="(max-width: 767px)">
<source src="https://stream.dodocast.com/bgv/code.mp4" type="video/mp4">
</video>
<div class="bg-video__content">
<!-- Бейне үстіндегі мәтініңіз -->
</div>
</div>- Браузер бейнені өздігінен іске қоспаса (қуат үнемдеу, блоктаушылар), келуші постерді көреді.
- Тар экрандар телефон файлын алады; браузер оны өзі таңдайды.
- Сілтемелер тұрақты: клипті ауыстырғанда сайтыңыз кодты өзгертпей-ақ жаңасын алады.
See it on a demo page фоныңызды төрт түрде көрсетеді: толық экран, мәтін жанындағы терезеде, құрылғы экранында және телефонда.
Ойнатқыш беті (iframe)
Тек iframe қабылдайтын сайт құрастырғыштарына арналған. Құрастырғыштағы блоктың өлшемін орнатыңыз, ойнатқыш оны толығымен толтырады:
html
<iframe src="https://watch.dodocast.com/bgv/code" title="Background video"
aria-hidden="true" tabindex="-1"
style="width: 100%; height: 100%; border: 0; pointer-events: none;"></iframe>iframe арқылы клипті өз қалауыңызша қараңғылау немесе кесу мүмкін емес. Ол үшін жоғарыдағы кодты пайдаланыңыз.
Тұрақты сілтемелер
| Файл | URL |
|---|---|
| негізгі | https://stream.dodocast.com/bgv/<code>.mp4 |
| телефон | https://stream.dodocast.com/bgv/<code>-mobile.mp4 |
| постер | https://stream.dodocast.com/bgv/<code>.jpg |
Жаңартылды: