How to make the direction nav constant on flexslider?

Question

I want the little hover grey arrows to be display block and not animate when hovering over the thumbnail navigation. You can see the demo here. I have been wading through the javascript for the plugin and cannot for the life of me work out where it is animating the arrows. If I could, I would just comment out that code. So can anyone else?

Answer 1

This confused me for a little while, but it turns out the arrow animation isn't actually in the plugins javascript. It's in the CSS using -webkit-transition: all .3s ease;. If you look at the default CSS file and go to line 52 you need to remove the above out of .flex-direction-nav a. So the line should look like the below.

.flex-direction-nav a {
   width: 30px; 
   height: 30px; 
   margin: -20px 0 0; 
   display: block; 
   background: url(images/bg_direction_nav.png) no-repeat 0 0; 
   position: absolute; 
   top: 50%;
   z-index: 10; 
   cursor: pointer; 
   text-indent: -9999px; 
   opacity: 0;
}