Code icon

CSS - VIDEOS

Links


    //VIDEOS
    <video width="320" height="240" controls autoplay mute poster="posterimage.jpg">
    <source src="movie.mp4" type="video/mp4">
    <source src="movie.ogg" type="video/ogg">
    Your browser does not support the video tag.
    </video>
    


    //VIDEOS
    video {
        max-width: 100%;
        height: auto;
    }
    


    //iFRAMES
    <div class="videoWrapper">
    <iframe width="560" height="349" src="http://www.youtube.com/embed/n_dZNLr2cME?rel=0&hd=1" frameborder="0" allowfullscreen></iframe>
    </div>


    //VIDEOS
    /* Style the video: 100% width and height to cover the entire window */
    #myVideo {
        position: absolute;
        right: 0;
        bottom: 0;
        min-width: 100%;
        min-height: 100%;
    
    }
    /* Add some content at the bottom of the video/page */
    .content {
        position: fixed;
        bottom: 0;
        background: rgba(0, 0, 0, .5);
        color: #f1f1f1;
        width: 100%;
        padding: 20px;
    }
    /* Style the button used to pause/play the video */
    #myBtn {
        width: 200px;
        font-size: 18px;
        padding: 10px;
        border: none;
        background: #000;
        color: #fff;
        cursor: pointer;
    }
    #myBtn:hover {
        background: #ddd;
        color: black;
    }
    
    /*# sourceMappingURL=video.css.map */