Announcement

Collapse
No announcement yet.

Regarding embedded Videos width and frame

Collapse
X
Collapse
First Prev Next Last
 
  • Filter
  • Time
  • Show
Clear All
new posts

    Regarding embedded Videos width and frame

    Hello,

    Please could you help me

    1- How could I allow the video to occupy the whole width?
    2- How can i keep the video within its Frame?

    Thank you

    Click image for larger version

Name:	image.png
Views:	443
Size:	139.3 KB
ID:	18737

    #2
    I have this css

    Code:
    /* Changing Video width and height - START */
    .videocontainer {
        float: none;
    }
    @media (min-width: 1024px) {
        .linkcontainer .videocontainer .videothumbnail, .post-content .videocontainer .videothumbnail, .OLD__post-content .videocontainer .videothumbnail {
            width: 560px;
            height: 315px;
        }
    }
    /* Changing Video width and height - END */
    Last edited by glennrocksvb; 05-20-2019, 03:53 PM. Reason: Formatted code by wrapping it in CODE BBCode.

    Comment


      #3
      up for help

      Comment


        #4
        1. You can increase the width and height in that CSS code. But if you make the video occupy the whole width, then in some cases, the video thumbnail might be stretched and pixelated and wouldn't look good.
        2. I'm not sure if you already have the code below but try adding it in css_additional.
        Code:
        .videothumbnail img {
            height: 100%;
        }
        Helpful? Donate. Thanks!
        Buy me a coffeePayPal QR Code
        Fast VPS Host for vBulletin:
        A2 Hosting & IONOS

        Comment


          #5
          Checking........

          Comment


            #6
            I have this

            Code:
            * Changing Video play icon to red as youtube START */
            .videothumbnail .videothumbnailoverlay {
                width: 50px;
                height: 36px;
                border-radius: 13px;
                border: solid 1px #f00;
                background-image: none;
                background-color: #f00;
                position: absolute;
                left: 50%;
                top: 50%;
                margin-left: -26px;
                margin-top: -18px;
                box-shadow: 2px 2px 8px rgba(0,0,0,0.5);
            }
            
            .videothumbnailoverlay:before {
                content: '';
                display: block;
                position: absolute;
                left: 20px;
                top: 11px;
                height: 0;
                width: 0;
                border-top: solid 6px transparent;
                border-left: solid 5px #333;
                border-bottom: solid 8px transparent;
                border-left: solid 14px #fff;
            }
            
            .videothumbnail .videothumbnailoverlay:hover,
            .videothumbnail:hover .videothumbnailoverlay {
                background-image: none;
                border-color: #e60000;
                background-color: #e60000;
            }
            /* Changing Video play icon to red as youtube END */

            Comment


            • glennrocksvb
              glennrocksvb commented
              Editing a comment
              Did you try adding the code I suggested?

            #7
            Yes Glenn, it worked perfect regarding keeping videos within the frame. You are the best, thank you so much.

            Comment


              #8
              Glad to help Blackhorse!
              Helpful? Donate. Thanks!
              Buy me a coffeePayPal QR Code
              Fast VPS Host for vBulletin:
              A2 Hosting & IONOS

              Comment

              Users Viewing This Page

              Collapse

              There is 1 user viewing this forum topic.

              • Guest Guest

              Latest Posts

              Collapse

              Working...
              X
              Searching...Please wait.
              An unexpected error was returned: 'Your submission could not be processed because you have logged in since the previous page was loaded.

              Please push the back button and reload the previous window.'
              An unexpected error was returned: 'Your submission could not be processed because the token has expired.

              Please push the back button and reload the previous window.'
              An internal error has occurred and the module cannot be displayed.
              There are no results that meet this criteria.
              Search Result for "|||"