Two slideshows, two custom paginations

83 views
Skip to first unread message

Jeff

unread,
Jul 3, 2017, 12:49:54 PM7/3/17
to SlidesJS
Hi, anyone here still??

I'm using this example to set up custom paginations:

I'm stuck on separating the slideshow slide numbers. 


What happens is the pagination controls both slideshows.  


<script>
    function GotoSlide(slidenum) {
        $('a[data-slidesjs-item="' + slidenum + '"]').trigger('click');
    }


    $('#slides2').slidesjs({
        width: 500,
        height: 324,
        navigation: false,
        start: 3,
        callback: {
            loaded: function() {
                $("#50mm").click(function(e) {
                    e.preventDefault();
                    GotoSlide('0');
                });
                $("#53mm").click(function(e) {
                    e.preventDefault();
                    GotoSlide('1');
                });
                $("#59mm").click(function(e) {
                    e.preventDefault();
                    GotoSlide('2');
                });
                $("#65mm").click(function(e) {
                    e.preventDefault();
                    GotoSlide('3');
                });

            }
        }
    });


    $(function() {
        $('#slides').slidesjs({
            width: 350,
            height: 291,
            navigation: {
                effect: "fade"
            },
            pagination: {
                effect: "fade"
            },
            effect: {
                fade: {
                    speed: 400
                }
            },

            callback: {
                loaded: function() {
                    $("#2mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('0');
                    });
                    $("#4mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('1');
                    });
                    $("#5mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('2');
                    });
                    $("#7mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('3');
                    });
                    $("#9mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('4');
                    });
                    $("#11mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('5');
                    });
                    $("#13mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('6');
                    });
                    $("#15mm").click(function(e) {
                        e.preventDefault();
                        GotoSlide('7');
                    });

                }
            }


        });
    });
</script>
Enter code here...

Thin Soldier

unread,
Dec 4, 2017, 2:03:21 AM12/4/17
to SlidesJS
Reply all
Reply to author
Forward
0 new messages