如何实现SlitSlider jQuery插件

Question

I am trying to implement the SlitSlider carousel but there is a serious lack of documentation, and therefore I am having trouble.

Has anyone succesfuly used this? I keep getting TypeError: self._init is not a function

The code can be found on gitub

My code so far:

function initiate() {
        var $slider = $('ul.slider');

        $slider.slitslider({
            autoplay: true,
            interval: 1000
        });
} 

initiate();

Answer 1

I've just implemented this slider on my website and struggled with getting it to work. Without seeing your full code it's difficult to say why it's not working for you. But I do believe the script needs to be called on the page very specifically like so:

S(document.ready(function(){
    var loaded = false;        
    $(window).on('load resize',function(){
        loaded = true;            
        var Page = (function() {
            slitslider = $('ul.slider').slitslider({
                autoplay: true,
                interval: 1000
                }
            }),
            init = function(){
                initEvents();
            },
            initEvents = function(){
                // add your custom navigation events here
            };
            return {init:init};
        }) ();
        Page.init();
    });
});

I included the $(window).on('load resize') function to prevent the slitslider CSS elements from FOUC. Hope this helps!

Here's my site with the fullscreen slitslider fully implemented: http://www.estherlee.co