Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • #1127245

    Hi there

    We’re trying to work out why the ‘play’ button overlay on the video element (with preview image enabled) looks normal in preview mode, but when published it changes to a tiny play button in the top left corner?
    How do we stop this happening and make it show large and in the centre of the image as per normal?

    Look at our example in the link provided – it’s the image just below the Revolution slider.

    Thanks
    E

    #1127488

    Hey engage24,

    I couldn’t see any videos on the page you linked to, where exactly can we see the problem?

    Best regards,
    Rikard

    #1127567
    This reply has been marked as private.
    #1127798

    Hi,

    Thanks for the clarification. Please try the following in Quick CSS under Enfold->General Styling:

    .avia-video .av-click-to-play-overlay .avia_playpause_icon {
        position: absolute;
        top: 50%;
        left: 50%;
    }
    
    .avia-video .av-click-to-play-overlay .avia_playpause_icon:before {
        font-size:50px;
    }

    Best regards,
    Rikard

    #1128214
    This reply has been marked as private.
    #1128776

    Hi,

    Thank you for the update.

    Did you remove the button? It is no longer visible in the slider. Please create a test page so that we can see the issue.

    Best regards,
    Ismael

    #1128852
    This reply has been marked as private.
    #1129055

    Hi,

    Thank you for the update.

    The gray play button is center aligned — checked it on MS Edge. Could you provide a screenshot of the issue?

    Best regards,
    Ismael

    #1129272
    This reply has been marked as private.
    #1129447

    Hi,

    Thank you for the update.

    This css code should adjust the style of the play icon.

    #top .avia-video .av-click-to-play-overlay .avia_playpause_icon {
        opacity: 1;
        color: #ffffff;
        text-align: center;
        transform: translate(-50%, -50%);
        background-color: rgba(0, 0, 0, 0.5);
        padding: 17px 27px 7px 27px;
    }

    Best regards,
    Ismael

    #1129561

    Hi
    I applied this CSS code (it works), but it defaulted all our heading fonts back to normal thickness – where we had them set to thin.
    I can’t see what in your code is doing this?
    Thanks
    Eric

    #1129816

    Hi,

    Thank you for the update.

    This should not have affected the font. Please make sure that you copied the css declaration correctly. Check if the closing curly brace exists.

    Best regard
    Ismael

    #1129917
    This reply has been marked as private.
    #1130014

    Hi engage24,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

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

You must be logged in to reply to this topic.