JQ_首页广告案例

/*----css----*/

<style type="text/css">
.shao-add{height:672px;background:url(http://zunjueclub.com/img/bg/add_bg00.jpg) no-repeat center top;}
.shao-add-bg{background:url(img/bg/add_bg01.gif) repeat-x 0 0;position:relative;height:0;overflow:hidden;}
.shao-close{position:absolute;bottom:0;left:50%;font:12px/22px Arial;color:#FFF;cursor:pointer;100px;margin-left:-50px;text-align:center;display:none;}
</style>

/*----html----*/

<div class="shao-add-bg" id="shaoAdd">
 <div class="shao-add"></div>
 <div class="shao-close" id="shaoAddClose">关 闭</div>
</div>

/*----js----*/

<script type="text/javascript">
function winHeight(){return window.innerHeight || document.documentElement.clientHeight; };
(function(){
    var _hei = winHeight();
    document.body.style.height = _hei+"px";
})();
function imgload(url,callback){
    var _img = new Image();
    _img.src = url;
    if(_img.complete == false){
        _img.onload = function(){
        callback();
        };
        }else{
        callback();
        }
    }
imgload("http://zunjueclub.com/img/bg/add_bg00.jpg",function(){
    $("#shaoAdd").animate({
        height:672
        },1000,function(){
        $("#shaoAddClose").show();
        });
        setTimeout(function(){
            $("#shaoAdd").animate({
                height:0
                },1000);
            },5000);
    $("#shaoAddClose").click(function(){
        $("#shaoAdd").animate({
                height:0
                },1000);
        });
    });
</script>