Portfolio Carousel Filter

Question

I try to use this filter script for the carousel:
https://huynhhuynh.github.io/owlcarousel2-filter/#

It works when I add the customjs class to the carousel-container. But then, I HAVE TO LOAD the owl.carousel.js manually AGAIN! And when I do this I get the console log: SEMICOLON_carouselInit Function does not exist

Generally I use the AJAX Lazy Loading method - can I use this in conjunction with the carousel filter script from above? I can't find a way to bind it to the right object:

owl.owlcarousel2_filter( filter );

always throws me an error of: Uncaught ReferenceError: owl is not defined

It would be really really great to get any help from you with this!
Thanks a lot in advance!

SemiColonWeb · Accepted Answer

Hello,

Simply consider wrapping your Custom JS codes inside this:


jQuery(window).on( 'pluginCarouselReady', function(){
	...
});

This should definitely work fine. Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.

amadeus77 · Answer

Thanks a lot for this! And how to achieve that:

owl.owlcarousel2_filter( filter );

could also be assigned with different settings for different carousels on the same page? Could this be done by using different IDs? One more hint and I should get it...

Best Regards.

Semicolon Web · Answer

Hello, We are not sure how this works: and you will need to integrate this manually by yourself. However, you can now use Class on the Widget and then use the JS Initialization codes below: This should definitely work fine. For multiple Owl Carousels on the Page with different IDs, you can duplicat…