Skip to main content

Forums

This topic contains 5 replies, has 5 voices, and was last updated by  angelicalara 2 months ago.

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #277020

    borianparker
    Participant

    I’m still very much new at HTML and CSS, so sorry if my question isn’t as sharp as it should be, but bear with me:

    I currently have a video looping at the top of my web page, with a poster added. I want to make it so that the image I have set as a poster can be used as a replacement for the video when users are on a device with a maximum width of 940px. How do I do this? This is where my code is at so far:

    HTML:

    CSS:

    video {

    height: auto;

    width: 100%;

    }

    @media only screen

    and (max-device-width: 940px) {

    .videos {

    display: none;

    }

    #image {

    display: inline;

    }

    }

    @media only screen

    and (min-device-width: 940px) {

    .videos {

    display: inline;

    }

    #image {

    display: none;

    }

    }

    What is wrong here? Now when I open the page, the video starts playing regardless of screen width.

    #277098

    borianparker
    Participant

    ’m still very much new at HTML and CSS, so sorry if my question isn’t as sharp as it should be, but bear with me:Nox Showbox Mobdro

    I currently have a video looping at the top of my web page, with a poster added. I want to make it so that the image I have set as a poster can be used as a replacement for the video when users are on a device with a maximum width of 940px. How do I do this? This is where my code is at so far:
    |_________
    no updates!!!

    #277118

    Shikkediel
    Participant

    Maybe you could show us a live example, preferably a Codepen. I can’t see anything from the CSS that would be incorrect.

    #277367

    abhi989
    Participant

    I have this website i.e techboxs.org where i would like to add some video in html.However, i am not able to get it right after lot of attempt can anyone help me here. I have been using wordpress html editor for the job

    #277368

    Paulie_D
    Moderator

    @abhi989

    If you have a separate question, please ask it separately.

    BUT you would need to make a Codepen.io demo that we can properly interact with and adapt. A weblink of the existing page is of little use since the options available using Developer tools aren’t really up to the job.

    #280240

    angelicalara
    Participant

    does this works with wordpress? my site is https://noxdownload.com

Viewing 6 posts - 1 through 6 (of 6 total)

You must be logged in to reply to this topic.

icon-link icon-logo-star icon-search icon-star