Video background title

Lorem ipsum is simply dummy


MP4 Youtube Parallax Full screen Full screen parallax


<div class="header-video white">
    <div class="videobox">
        <div data-video-youtube="BX4yotn2FPI"></div>
        <div class="mobile-poster" style="background-image:url('')"></div>
    <div class="overlaybox">
        <div class="container">
            <div class="title-base">
                <hr class="anima" />
                <h1>TITLE COMPONENT / YOUTUBE VIDEO</h1>
                <p>Lorem Ipsum is simply dummy text of the printing.</p>

Main settings

Name Type Description
Youtube link String Replace ID of data-video-youtube with the ID of your Youtube video.
Mobile devices Information Youtube autoplay not work on mobile devices and it is replaced with a static image, the image is code <div class="mobile-poster" style="background-image:url('image.jpg')"></div>.
White CSS Add class white to the container object to convert all colors to white. Use this feature for dark backgrounds.
Overlay pattern Mixed Add the code <div class="bg-overlay dotted"></div> into the title, as first row.
Overlay pattern is a feature of Javascript and CSS, complete documentation and patterns list here
Code location Information Insert the title code just belove header code. Example:
    <div class="header-video">