Set interval to make auto-slide functionality(Magento Site)

Question

the below-following code is written by freelancer programmer for the silde banner for our Magento website. This is only for slide banner when the customer clicks the pager navigation menu; it slides to next banner. I want to set Interval for this so that It can automatically slide with clicking pager button. Thank you!!!

function initialize_banner_slider(banner_id) {
    if ($(banner_id).size() <= 0) return;

    var make_center = function(center) {
    center.removeClass("on_right").removeClass("on_left").addClass("on_center");
    $("body").removeClass("theme-light").removeClass("theme-dark").addClass("theme-"+center.data("theme"));
    center.find(".fadeup").each(function() {
        $(this).hide().css("top", (parseInt($(this).data("pos-y"))/750*100+100) + "%");
    });
    $(banner_id + " ul.banner_pager li").removeClass("active");
    $($(banner_id + " ul.banner_pager li")[center.index()]).addClass("active");
    setTimeout(function() {
        center.find(".fadeup").each(function() {
            $(this).show().animate({"top": "-=100%"});
            /* $(this).css("top", parseInt($(this).data("pos-y"))); */
        });
    }, 600);
}

var move_full_card_left = function(banner_id) {
    if ($(banner_id).find(".on_right").size() > 0) {
        $(banner_id).find(".on_center").removeClass("on_center").addClass("on_left");
        make_center( $(banner_id).find(".on_right").first() );

        if ($(banner_id).find(".on_right").size() == 0) {
            // hide arrow
            $(banner_id).find(".move_right").hide();
        } else {
            // show arrow
            $(banner_id).find(".move_right").show();
        }
        $(banner_id).find(".move_left").show();
    }
    return false;
}
var move_full_card_right = function(banner_id) {
    if ($(banner_id).find(".on_left").size() > 0) {
        $(banner_id).find(".on_center").removeClass("on_center").addClass("on_right");
        make_center( $(banner_id).find(".on_left").last() );
        if ($(banner_id).find(".on_left").size() == 0) {
            // hide arrow
            $(banner_id).find(".move_left").hide();
        } else {
            // show arrow
            $(banner_id).find(".move_left").show();
        }
        $(banner_id).find(".move_right").show();
    }
    return false;
}

$(banner_id).find(".move_left").click(function() {
    return move_full_card_right(banner_id);
});
$(banner_id).find(".move_right").click(function() {
    return move_full_card_left(banner_id);
});

for (var i=0, l=$(banner_id+" > ul.slider > li").size(); i<l; i++) {
    var pager = $("<li></li>");
    pager.on("click", function() {
        var index = $(this).index();
        $(banner_id+" > ul.slider > li").each(function(ndx, val) {
            if (ndx < index) {
                $(this).removeClass("on_center").removeClass("on_right").addClass("on_left");
            } else if (ndx > index) {
                $(this).removeClass("on_center").removeClass("on_left").addClass("on_right");
            } else if (ndx == index) {
                make_center($(this));
            }
        });
    });
    pager.appendTo($(banner_id + " ul.banner_pager"));
}

var first = true;
$(banner_id+" > ul.slider > li").each(function(elem) {
    if (first) {
        make_center( $(this) );
        first = false;
    } else {
        $(this).addClass("on_right");
    }
    $(this).on("swipeleft", function() {
        return move_full_card_left(banner_id);
    }).on("swiperight", function() {
        return move_full_card_right(banner_id);
    });
    $(this).css("background-image", "url("+$(this).data("background-image")+")");
});

if ($(banner_id+" > ul.slider > li").size() < 2) {
    $(banner_id).find(".move_right").hide();
}
$(banner_id).find(".move_left").hide();

}

function initialize_parallax() {
  $(".responsive_wrapper").each(function() {
    var base_width = $(this).data("width");
    var base_height = $(this).data("height");
    $(this).css({
        "max-width": base_width+"px",
        "max-height": base_height+"px"
    });
    $(this).find(".responsive").each(function() {
        $(this).css({
            "width": $(this).data("width")/base_width*100 + "%", 
            "height": $(this).data("height")/base_height*100 + "%", 
            "left": $(this).data("pos-x")/base_width*100 + "%", 
            "top": (parseInt($(this).data("pos-y"))/base_height*100) + "%",
        });
    });
});
}

$(document).ready(function() {
  /* parallax positioning */
  // $(".verus-cms .parallax").insertAfter( $(".page-header") );
  $("#product-list-toolbar2").prependTo(".col-main");

  initialize_parallax();
  initialize_banner_slider("#top_banner");
  initialize_banner_slider("#lific_banner");

Answer 1

You would add something like this:

setInterval(function(){move_full_card_right(banner_id);},5000);

You should be able to throw that in you document ready as long as you can get the banner_id. I don't know how you are setting the banner id, so I can't help you with that.