Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • April 15, 2017 at 7:44 am #778144
    netcoenterprises

    I’m using a fullscreen Slideshow as my homepage with a centered ‘Enter’ button. I would like for that button to only appear when the mouse is rolled into the screen.

    I was able to use similar code below to accomplish this with the Next & Prev arrows but I’m not sure how to implement the same thing for the slider buttons. I can use some help.

    .arrow_controls.slide_controls {
    opacity: 0;
    }

    #slideshow_big:hover .arrow_controls.slide_controls {
    opacity: 1 !important;
    }

    April 15, 2017 at 8:35 am #778160
    John Torvik

    Hey netcoenterprises,

    May you share your website link? This way will be easier to provide some custom code to help you.

    Best regards,
    John Torvik

    April 15, 2017 at 8:46 am #778163
    netcoenterprises

    Hello,
    See link below. Thank you for your attention.

    April 16, 2017 at 4:52 am #778359
    Vinay

    Hi,

    Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child themes style.css file:

    #top .avia-slideshow-button {
	display: none;
}
#top .avia-slideshow:hover .avia-slideshow-button {
	display: inline-block!important;
}

    I have tested this code on your installation and works 100% please make sure to refresh the cache to preview changes.

    Best regards,
    Vinay

    April 16, 2017 at 8:48 am #778397
    netcoenterprises

    Vinay – That works perfectly – awesome. THANK YOU

    April 17, 2017 at 4:22 am #778544
    Rikard

    Hi,

    Great, glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

    Best regards,
    Rikard

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