1

I'm currently trying to setup a custom thumbnail navigation for FlexSlider and i am using the following code which i believe is correct according to the official flexslider documentation:

$(document).ready(function(e) {
  $('.flexslider').flexslider({
    animation: "slide",
    controlsContainer: ".flex_thumbs",
    controlNav: true,
    manualControls: ".custom_controls li img",
    animationSpeed: 1200,
  }); 
});

The problem is when i run my page i encounter the following error in my console log:

a.controlNav.live is not a function

and of course my custom thumbnails do not work.

Has anyone encountered this particular error before? I tried searching online but could not find any answers to this particular problem.

Any help is appreciated.

2 Answers2

2

I just encountered this problem too. Arre you using jQuery 1.9?

jQuery versions >=1.9.x have dropped support for .live method, therefore .on has to be used.

https://github.com/woothemes/FlexSlider/pull/597

I changed mine back to jquery 1.8.3 and it is now working.

Hope this helps.

user1616625
  • 1,072
  • 1
  • 9
  • 15
1

If you are still having this problem, the explanation is the following:

jQuery method .live() is deprecated, in case you have to stick with the flexslider version you are using for some reason you can solve the problem by looking into the flexslider js code and replace any ocurrance of method .live with method .on. Look for .live( so you get the method not other variables or something and replace it with .on( and you should be all set.

Carlos Calla
  • 6,556
  • 2
  • 16
  • 23