$(function(){
	var swidth = $("#focus").width();
var len = $("#focus ul li").length;
var index = 0;
var pictimer;
var btn = "<div class='btnbg'></div><div class='btn'>";
for (var i = 0; i < len; i++) {
    btn += "<span></span>"
}
btn += "</div><div class='prenext pre'></div><div class='prenext next'></div>";
$("#focus").append(btn);
$("#focus .btnbg").css("opacity", 0.5);
$("#focus .btn span").css("opacity", 1).mouseover(function() {
    index = $("#focus .btn span").index(this);
    showpics(index)
}).eq(0).trigger("mouseover");
$("#focus .prenext").css("opacity", 0.8).hover(function() {
    $(this).stop(true, false).animate({
        "opacity": "0.5"
    },
    300)
},
function() {
    $(this).stop(true, false).animate({
        "opacity": "0.8"
    },
    300)
});
$("#focus .pre").click(function() {
    index -= 1;
    if (index == -1) {
        index = len - 1
    }
    showpics(index)
});
$("#focus .next").click(function() {
    index += 1;
    if (index == len) {
        index = 0
    }
    showpics(index)
});
$("#focus ul").css("width", swidth * (len));
$("#focus").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;
    $("#focus ul").stop(true, false).animate({
        "left": nowleft
    },
    300);
    $("#focus .btn span").removeclass("on").eq(index).addclass("on")
}
var swidth2 = $("#scrollleft").width();
var len2 = $("#scrollleft ul li").length;
var index2 = 0;
var pictimer2;
var btn2 = "<div class='btnbg2'></div><div class='btn2'>";
for (var i = 0; i < len2; i++) {
    btn2 += "<span></span>"
}
btn2 += "</div>";
$("#scrollleft").append(btn2);
$("#scrollleft .btn2 span").css("opacity", 1).mouseover(function() {
    index2 = $("#scrollleft .btn2 span").index(this);
    showpics2(index2)
}).eq(0).trigger("mouseover");
$("#scrollleft ul").css("width", swidth2 * (len2));
$("#scrollleft").hover(function() {
    clearinterval(pictimer2)
},
function() {
    pictimer2 = setinterval(function() {
        showpics2(index2);
        index2++;
        if (index2 == len2) {
            index2 = 0
        }
    },
    4000)
}).trigger("mouseleave");
function showpics2(index) {
    var nowleft2 = -index2 * swidth2;
    $("#scrollleft ul").stop(true, false).animate({
        "left": nowleft2
    },
    300);
    $("#scrollleft .btn2 span").removeclass("on").eq(index2).addclass("on")
}
$("#fourid li").hover(function() {
    $(this).addclass("on").siblings().removeclass("on")
},
function() {
    $("#fourid li").removeclass("on")
})
$("#wbllist dt").hover(function() {
    $("#wbllist dd").hide();
    $("#wbllist dt").removeclass("wblon");
    $(this).addclass("wblon");
    $(this).next("dd").show()
})
})