请问我一个层在窗口右下角，如何让它逐渐变大到占据整个窗口

请问我一个层在窗口右下角，如何让它逐渐变大到占据整个窗口 rt 谢谢

解决方案 »

  1.   

    可以使用一个循环定时器
    setInterval
    演示代码：
    a.html
    --------------------------------------------------------------------------------
    <html>
    <script language=javascript>var g_div,g_div_x,g_div_y,g_div_w,g_div_h;
    var g_win_w,g_win_h;
    function demo()
    {
    g_div = document.all.div1;
    g_win_w = document.body.clientWidth;
    g_win_h = document.body.clientHeight;
    timer_name = setInterval("timer_func();",10);
    }
    function timer_func()
    {
    g_div_x = g_div.style.pixelLeft;
    g_div_y = g_div.style.pixelTop;
    g_div_w = g_div.style.pixelWidth;
    g_div_h = g_div.style.pixelHeight; if(g_div_x==0 && g_div_y==0 && g_div_w==g_win_w && g_div_h==g_win_h)
    {
    clearInterval(timer_name);
    g_div.style.background = "blue";
    }
    else
    {
    g_div_x--; if(g_div_x<=0) g_div_x=0;
    g_div_y--; if(g_div_y<=0) g_div_y=0;
    if( g_div_x+g_div_w+2>=g_win_w )
    g_div_w+=1;
    else
    g_div_w+=2;
    if(g_div_w>=g_win_w) g_div_w = g_win_w; if( g_div_y+g_div_h+2>=g_win_h )
    g_div_h+=1;
    else
    g_div_h+=2;
    if(g_div_h>=g_win_h) g_div_h = g_win_h; g_div.style.pixelLeft   = g_div_x;
    g_div.style.pixelTop    = g_div_y;
    g_div.style.pixelWidth  = g_div_w;
    g_div.style.pixelHeight = g_div_h;
    }
    }
    </script>
    <body>
    <input type=button value="click me" onclick=demo()>
    <div id=div1 style=position:absolute;left:378;top:200;width:100;height:234;background-color:yellow>Hello FuWaer!</div>
    </body>
    </html>
    --------------------------------------------------------------------------------