$(document).ready(function () {
    var BannerLinkList = $(".banner-links ul");

    var BannerWidth = 995;
    var PreviousBanner = 0;
    var BannerCount = $(".banner").length;
    $(".banner").each(function (i) {
        var li = $("<li>");
        var a = $("<a>");
        a.html($(this).attr("title"));
        a.attr("href", "#").attr("id", "a" + i);
        a.click(function (e) {
            this.blur();
            e.preventDefault();
            var CurrentBanner = this.id.replace("a", "");
            if (PreviousBanner != CurrentBanner) {
                $("#a" + PreviousBanner).parent().removeClass("on");
                $(this).parent().addClass("on");
                PreviousBanner = CurrentBanner;
                $(".banners").animate({ left: -(BannerWidth * CurrentBanner - 3) }, 300);
            }
            $f().pause();
        });

        if (i == 0) {
            li.addClass("on");
        }
        li.append(a);
        BannerLinkList.append(li);
    });

    $(".left-btn").click(function (e) {
        this.blur();
        e.preventDefault();
        $("#a" + ((+PreviousBanner) - 1).toString()).trigger("click");
    });
    $(".right-btn").click(function (e) {
        this.blur();
        e.preventDefault();

        if((+PreviousBanner) + 1 == BannerCount){
          $("#a" + PreviousBanner).parent().removeClass("on");
          PreviousBanner = -1;
        }
        $("#a" + ((+PreviousBanner) + 1).toString()).trigger("click");
       
    });
});