日期:2014-05-16  浏览次数:21165 次

ASP.NET+jQuery轮播效果
<style type="text/css">
        #round_up_adv img{width:535px;height:212px;}  
        #round_up_adv #play_text{position:absolute;margin:188px 0 0 360px;height:20px;width:200px;z-index:1002}
        #round_up_adv #play_bg {position:absolute;background-color:#000;margin-top:180px;height:30px;width:535px;filter: Alpha(Opacity=30);opacity:0.3;z-index:1000}
        #round_up_adv #play_list a{display:block;width:535px;height:212px;position:absolute;overflow:hidden;float:left;}
    </style>
    <script type="text/javascript">
        var t = n = count = 0;
        $(function () {
            count = $("#play_list a").size();
            $("#play_list a:not(:first-child)").hide();
            $("#play_info").html($("#play_list a:first-child").find("img").attr('alt'));
            $("#play_text li:first-child").css({ "background": "#fff", 'color': '#000' });
            $("#play_info").click(function () { window.open($("#play_list a:first-child").attr('href'), "_blank") });
            $("#play_text li").click(function () {
                var i = $(this).text() - 1;
                n = i;
                if (i >= count) return;
                $("#play_info").html($("#play_list a").eq(i).find("img").attr('alt'));
                $("#play_info").unbind().click(function () { window.open($("#play_list a").eq(i).attr('href'), "_blank") })
                $("#play_list a").filter(":visible").fadeOut(500).parent().children().eq(i).fadeIn(1000);
                $(this).css({ "background": "#8FE7F5", 'color': '#000' }).siblings().css({ "background": "#3783A3", 'color': '#ECF3FD' });
            });
            t = setInterval("showAuto()", 5000);
            $("#round_up_adv").hover(function () { clearInterval(t) }, function () { t = setInterval("showAuto()", 2000); });
        })

        function showAuto() {
            n = n >= (count - 1) ? 0 : n + 1;
            $("#play_text li").eq(n).trigger('click');
        }
    </script>
<div id="round_up_adv">
            <div id="play_bg"></div>
        <div id="play_text">
        <ul>