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

    Great theme!

    I’m not sure if this a LayerSlider or Enfold question…so I’ll start here.

    The “play button” overlay when one of the LayerSlides includes a video is very difficult to see/too small. How can I change that out?

    Thanks in advance,

    Michael

    #203481

    Hi michaelhiga!

    How did you add the video? Can you please give us a link to the page with the slider video?

    Regards,
    Ismael

    #203485
    This reply has been marked as private.
    #203495

    Hey!

    Edit config-layerslider > LayerSlider > skins > fullwidth > skin.png, adjust the size of the play button:

    Adjust the width and height of the button using this on your Quick CSS:

    .ls-fullwidth .ls-playvideo {
    width: 100px;
    height: 100px;
    margin-left: -25px;
    margin-top: -25px;
    }

    Best regards,
    Ismael

    #203844

    Hello-

    I’ve tried this and the larger “play” button is getting cropped – please see the 2nd and 3rd sliders on:

    http://stg.ciphercloud.com/

    #203855

    Hey!

    Try with this code instead:

    .ls-fullwidth .ls-playvideo {
    	width: 70px;
    	height: 70px;
    	margin-left: -25px;
    	margin-top: -25px;
    	background-position: -290px -140px !important;
    }
    

    Cheers! 
    Josue

    #203888

    Hi-
    It’s different – but still not correct – please see:

    http://stg.ciphercloud.com/

    #203890

    Hi!

    Please add following code to Quick CSS as well

    .ls-fullwidth .ls-playvideo {
    width: 70px;
    height: 70px; }

    Best regards,
    Yigit

    #203893

    I think I already have that – this below is exactly what I have:
    .ls-fullwidth .ls-playvideo {
    width: 70px;
    height: 70px;
    margin-left: -25px;
    margin-top: -25px;
    background-position: -290px -140px !important;
    }

    #203897

    Hi!

    Yeah sorry my bad. Code is currently not being applied, you should add !important to force it and then it should work fine

    .ls-fullwidth .ls-playvideo {
    width: 70px!important;
    height: 70px!important;
    }

    Best regards,
    Yigit

    #203901

    Yes! that makes the whole enlarged button visible, but now the “hover” effect doesn’t work (ie, the button doesn’t change highlight).

    #203905

    Hi!

    You can add following code to decrease the opacity on hover

    .ls-fullwidth .ls-playvideo:hover { opacity: 0.5; }

    Regards,
    Yigit

    #203909

    Thanks! just so I’m sure I have it right – below is exactly what I have – is this correct?

    .ls-fullwidth .ls-playvideo {
    width: 70px;
    height: 70px;
    margin-left: -25px;
    margin-top: -25px;
    background-position: -290px -140px !important;
    }
    .ls-fullwidth .ls-playvideo {
    width: 70px!important;
    height: 70px!important;
    }
    .ls-fullwidth .ls-playvideo:hover { opacity: 0.5; }

    #203913

    Hey!

    Yes, it looks fine. I just checked your website and it is working fine as well. If it is not on your end, you can try flushing browser cache and refresh your page.

    Regards,
    Yigit

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

You must be logged in to reply to this topic.