屏幕弹出层，淡入淡出

今天要做一个屏幕弹出层淡如淡出的效果，在网上找了一些例子，总结了一下，写了个控件。

我希望把程序中的各个功能，尽量以控件的形式写出来。

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="屏幕弹出层.ascx.cs" Inherits="屏幕弹出层.屏幕弹出层" %>

<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
<script type="text/javascript">
//    var sWidth, sHeight;//取屏幕的宽和高
//    sWidth = screen.width;
//    sHeight = screen.height;
    var cWidth, cHeight; //取窗体的宽和高
    cHeight = document.documentElement.clientHeight;
    cWidth = document.documentElement.clientWidth;
    function fadeIn() {
        $("#popup").fadeIn(1000);  //速度毫秒
        $("#popup").css("width", cWidth);
        $("#popup").css("height", cHeight);
    }
    function fadeOut() {
        $("#popup").fadeOut(2000);
    }
    function fadeTo() {
        $("#popup").fadeTo(1000, 0.5); //参数1指速度，参数2指透明度  
        $("#popup").css("width", sWidth);
        $("#popup").css("height", sHeight);
    }
</script>
<style type="text/css">
    /*大背景div样式*/
    .BackGroundBigDiv
    {
        display: none;
        background-color: silver;
        position: absolute;
        left: 0;
        top: 0;
    }
    /*中间小div样式*/
    .TheCenterOutDiv
    {
            
    }
</style>
<div>
    <input type="button" value="弹出层" οnclick="fadeIn()" />
    <input type="button" value="半透明弹出层" οnclick="fadeTo()" />
    <div class="BackGroundBigDiv" id="popup">
        弹出层的试验
        <input type="button" value="取消" οnclick="fadeOut()">
    </div>
</div>