码迷,mamicode.com
首页 > 编程语言 > 详细

JavaScript特效实例016-动态显示窗口

时间:2015-05-21 12:45:47      阅读:158      评论:0      收藏:0      [点我收藏+]

标签:javascript

实例016                      动态显示窗口

实例说明

在打开窗口时,将窗口设置为最小的宽度,并使窗口的高度逐渐增加,当窗口的高度与屏幕的高度一致时,使窗口的宽度不断增加,直到与屏幕的宽度相一致。

技术要点

本实例主要应用了screen对象的availWidth和availHeight属性获得当前屏幕的宽度和高度,并使用resizeTo()方法来自动增加窗口的高度和宽度。

实现过程

实现功能主页面Index.html
<html>
<head>
    <title></title>
    <script language="JavaScript">
        function pp()
        {
            alert("1");
            var heightspeed = 2;
            var widthspeed = 7;
            var leftdist = 0;
            var topdist = 0;
            var winwidth = window.screen.availWidth - leftdist;
            var winheight = window.screen.availHeight - topdist;
            for (var sizeheight = 1; sizeheight < winheight; sizeheight += heightspeed)
            {
                self.resizeTo("1", sizeheight);
            }
            for( var sizewidth = 1;sizewidth<winwidth;sizewidth+=widthspeed)
            {
                self.resizeTo(sizewidth, sizeheight);
            }
        }

    </script>
</head>
    <body onload="pp()"></body>
</html>
这样本实例就做好了。


JavaScript特效实例016-动态显示窗口

标签:javascript

原文地址:http://blog.csdn.net/yejinwei1220/article/details/45889361

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!