Search code examples
jqueryhtmlcssflexslider

Flexslider Nav button not working in hover

Okay, I'm using flexslider 2. I've used it plenty of times in my projects and have never had an issue before.

When I hover over the banner image the Next and Previous buttons should slide in but they do not. I am just using all the default functions nothing fancy. I can't find any issues in my code that would prevent flexslider from acting correctly. Any help would be appreciated.

The nav buttons are present and opacity is 0 by flexslider default css and should appear on hover but do not.

Project can been seen here:

http://madmen6raphics.com/clients/marble/index.html

Solution

  • Open up flexslider.css and change the following

    from 

    
    .flexslider:hover .flex-prev { opacity: 0.7; left: 10px; }
    .flexslider:hover .flex-next { opacity: 0.7; right: 10px; }

    to

    
    .slider:hover .flex-prev { opacity: 0.7; left: 10px; }
    .slider:hover .flex-next { opacity: 0.7; right: 10px; }