I need to use this slider plugin "slick" inside my code but couldn't achieve it!
define('modules/slider', ['jquery', 'slick'], function($, slick) {
var widgetDisplay = function() {};
widgetDisplay.prototype = {
name: 'Display',
init: function(scope) {
"use strict";
var me = this;
console.log('slider module loaded + ' + slick);
}
};
return widgetDisplay;
});
In the config, I have;
require.config({
baseUrl: '<?php echo WPF__ASSETS; ?>scripts/',
paths: {
"modernizr": "<?php echo WPF__ASSETS; ?>scripts/modernizr",
"jquery": "<?php echo WPF__ASSETS; ?>scripts/jquery",
"fastclick": "<?php echo WPF__ASSETS; ?>scripts/fastclick",
"foundation": "<?php echo WPF__ASSETS; ?>scripts/foundation",
"slick": "<?php echo WPF__ASSETS; ?>scripts/slick"
},
shim: {
'foundation': {
deps: ['jquery']
},
'slick': {
deps: ['jquery'],
exports: 'jQuery.fn.slick'
},
'modernizr': {
exports: 'modernizr'
}
}
});
But his outputs;
Uncaught ReferenceError: slick is not defined
Oops! I found out why I got errors :)
First fix, I removed slick
on the function; define('modules/slider', ['jquery', 'slick'], function($){
The console.log thing was wrong, I used instead;
$('#header_slider').slick({
slidesToShow: 3,
slidesToScroll: 1,
autoplay: true,
autoplaySpeed: 2000,
onInit: function() {
console.log('Slick is on!');
}
});
Thanks :)
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