Uncaught TypeError: undefined is not a function - Carousel Owl
I use:
- wordpress site
- owl carousel plugin
Here is the JQuery code I am using:
$(document).ready(function() {
$("#owl-images").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
$(document).ready(function() {
$("#owl-videos").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
I read that wordpress links to jquery in this question, but I even changed it to:
jQuery(document).ready(function() {
jQuery("#owl-images").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
jQuery(document).ready(function() {
jQuery("#owl-videos").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
But still doesn't work, still getting
Uncaught TypeError: undefined is not a function
+3
source to share
3 answers
jQuery(document).ready(function($) {
$("#owl-images").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
jQuery(document).ready(function($) {
$("#owl-videos").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
+4
source to share
My answer comes a little later, but I hope this helps others.
- see js changes below
jQuery(document).ready(function($) {
$("#owl-images").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
jQuery(document).ready(function($) {
$("#owl-videos").owlCarousel({
items : 3,
itemsDesktop : [1199,3],
itemsDesktopSmall: [979,2],
itemsTablet : [768,1],
lazyLoad : true,
navigation : false,
autoPlay : true,
autoHeight: true
});
});
- If making changes above one does not work in your WordPress theme, call owl.carousel.js or owl.carousel.min.js in the chapter section, not in the footer
+2
source to share