$(function() {
    var container = $('.banners_list');
    var banners = $('.banners_item');
    var current = banners.first();

    var buttons = $('.banners_left, .banners_right');


    buttons.click(function(event) {
        event.preventDefault();

        var isLeft = $(this).hasClass('banners_left');

        var next = isLeft ? current.prev() : current.next();

        if (!next.length) {
            next = isLeft ? banners.last() : banners.first();
        }

        if (next.length) {
            showBanner(next);

            current = next;
        }
    });


    $(window).resize(function() {
        showBanner(current);
    });


    function showBanner(banner) {
        container.scrollLeft(container.width() * banner.index());
    }

});