$(function() {
    jquery.focus = function(slid) {
        var swidth = $(slid).width();
        var len = $(slid).find("ul li").length;
        var index = 0;
        var pictimer;

        var btn = "<div class='prenext pre'></div><div class='prenext next'></div>";
        $(slid).append(btn);
        $(slid + " .prenext").css("opacity",0.45).hover(function() {
            $(this).stop(true,false).animate({"opacity":"1"},300);
        },function() {
            $(this).stop(true,false).animate({"opacity":"0.45"},300);
        });

        $(slid + " .pre").click(function() {
            index -= 1;
            if (index == -1) index = len - 1;
            showpics(index);
        });
        $(slid + " .next").click(function() {
            index += 1;
            if (index == len) index = 0;
            showpics(index);
        });

        $(slid + " ul").css("width",swidth * (len));

        $(slid).hover(function() {
            clearinterval(pictimer);
        },function() {
            pictimer = setinterval(function() {
                showpics(index);
                index++;
                if(index == len) index = 0;
            },4000);
        }).trigger("mouseleave");

        function showpics(index) {
            var nowleft = -index*swidth;
            $(slid + " ul").stop(true,false).animate({"left":nowleft},300);
        }
    };
});