I have a page in my project that contains several categories and in each category, it has a Flexslider with the images. Each category is displayed once and clicking another one, the previous one is hidden and the one clicked appears, a scheme similar to Tabs.
I need when I click on another category, it will destroy the Flexslider function started in the previous category and run in this category.
Here's what I've done so far, but to no avail:
Function that starts Flexslider:
vm.sliderCol = function () {
setTimeout(function () {
$('.sliderCol').flexslider({
animation: "slide",
controlNav: false
});
}, 1000);
}
Function that I inserted into the category button:
vm.clicou = function(){
$('.sliderCol').flexslider("destroy");
console.log('destruiu');
setTimeout(function () {
vm.sliderCol();
console.log('iniciou');
}, 1000);
}
Until then, I tried to destroy the Flexslider, I do not know if there is any method to stop running the function and start it, can anyone help?