Viewing 14 posts - 1 through 14 (of 14 total)
  • Author
    Posts
  • August 13, 2019 at 2:58 pm #1127245
    engage24

    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

    August 14, 2019 at 6:27 am #1127488
    Rikard

    Hey engage24,

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

    Best regards,
    Rikard

    August 14, 2019 at 11:39 am #1127567
    engage24
    This reply has been marked as private.
    August 15, 2019 at 5:35 am #1127798
    Rikard

    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

    August 16, 2019 at 10:07 am #1128214
    engage24
    This reply has been marked as private.
    August 19, 2019 at 2:36 am #1128776
    Ismael

    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

    August 19, 2019 at 10:46 am #1128852
    engage24
    This reply has been marked as private.
    August 20, 2019 at 1:16 am #1129055
    Ismael

    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

    August 20, 2019 at 5:36 pm #1129272
    engage24
    This reply has been marked as private.
    August 21, 2019 at 6:27 am #1129447
    Ismael

    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

    August 21, 2019 at 12:39 pm #1129561
    engage24

    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

    August 22, 2019 at 2:47 am #1129816
    Ismael

    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

    August 22, 2019 at 10:02 am #1129917
    engage24
    This reply has been marked as private.
    August 22, 2019 at 4:10 pm #1130014
    Victoria

    Hi engage24,

    Glad you got it working for you! :)

    If you need further assistance please let us know.

    Best regards,
    Victoria

  • Author
    Posts
Viewing 14 posts - 1 through 14 (of 14 total)
  • You must be logged in to reply to this topic.