Menu
I'm trying to use this jQuery plugin ( http://kenwheeler.github.io/slick/ ) to a carousel. I tried many different plugins, but I always face some kind of error. So, I'm sticking with this until I figure out whats wrong.
Here is my HTML head:
<head>
<!--[if lt IE 9]>
<script src='http://html5shiv.googlecode.com/svn/trunk/html5.js'></script>
<![endif]-->
<meta charset='utf-8' />
<meta name='viewport' content='width=device-width, initial-scale=1.0'>
<meta http-equiv='X-UA-Compatible' content='IE=edge'>
<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>
<link rel="stylesheet" type="text/css" href="slick/slick.
<script type=" text/javascript " src="slick/slick.min.js "></script>
<script type="text/javascript " src='/js/carousel.js'></script>
</head>
When I tried it, I got an 'Uncaught TypeError: undefined is not a function' at line to of my JS where I call the function 'slick'. Here it where I call it:
<div class="slider single-items"><div></div><div></div><div></div></div>
And here is my carousel.js:
$(document).ready(function () {
$('.single-item').slick({
dots: true,
infinite: true,
speed: 300,
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true
});
});
872
I had similar problem, but in my case issue was following:
I had installed slick by bower install slick instead bower install slick.js which caused that I had totally different library included in my dependecies.
86
You are selecting $('.single-item'), but your markup has elements with class single-items (with a "s" at the end). Assuming this pasted code is correct, your jQuery should be changed to $('.single-items').
$(document).ready(function () {
$('.single-items').slick({
dots: true,
infinite: true,
speed: 300,
slidesToShow: 1,
slidesToScroll: 1,
autoplay: true
});
});
JSFiddle: http://jsfiddle.net/N6wfG/
22
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
