今天是:
设为首页 加入收藏 网站地图  
正在加截flash,如果长时间无显示,请下载FlashPlayer 9.0
您现在的位置: 呼网互联 >> 技术教程 >> 网站建设 >> Javascript >> 教程正文 用户登录 新用户注册
[组图]用JS将网页窗口由小变大         
用JS将网页窗口由小变大
作者:晴天小猪 文章来源:5D多媒体 点击数: 更新时间:2005-01-08 00:03:13

    有没有这种经历,当你打开一个链接的时候,浏览器窗口由小变大,呈现一个渐变的过程。下面,我们就来介绍这种动态效果的由来,大家可要看仔细了。

  这种程式的思路就是先根据浏览器的可利用的宽度和高度,算出一个中心坐标点,然后每次都把窗口定位到这个点上,再算出相应窗口的变大尺寸,循环50次,从而最终回到浏览器最大化时的状态。

  在<body>和</body>之间插入下列代码:

<SCRIPT LANGUAGE="javascript">
<!-- Begin
function expand() {
for(x = 0; x < 50; x++) {
window.moveTo(screen.availWidth * -(x - 50) / 100, screen.availHeight * -(x - 50) / 100);
//定义动态的窗口定位点
window.resizeTo(screen.availWidth * x / 50, screen.availHeight * x / 50);
//定义动态窗口的尺寸
}
window.moveTo(0,0);
window.resizeTo(screen.availWidth, screen.availHeight);
//当50次的变动完成,定位窗口回到(0,0),大小为最大化时的状态。
}
// End -->
</script>
<p>
<a href="http://www.5dmedia.com" onClick="expand();">点击链接看效果</a>

这里的链接可以填入你所希望的网址。

  我们运行一下,就可以看到以下的效果了:

开始时

最后

 

教程录入:流云    责任编辑:流云 
  • 上一篇教程:

  • 下一篇教程:
  • 【字体: 】【发表评论】【加入收藏】【告诉好友】【打印此文】【关闭窗口
    · Win XP设置技巧
    · 注册表全攻略
    · Dreamweaver 8
    · Fireworks 8
    · Flash 8
    · Photoshop CS2
    · Corel Draw
    普通教程[组图]十招学会使用Win
    普通教程[组图]Vista兼容性问题
    普通教程[组图]让低端显卡运行V
    推荐教程[图文]多图激赏:Window
    普通教程[组图]Windows Vista小
    推荐教程[图文]CSS实现星级效果
    普通教程[组图]你知道吗?有关V
    推荐教程[图文]廿五则Windows V
    推荐教程[图文]多图激赏:Window
    推荐教程[图文]CSS实现星级效果
    推荐教程[图文]廿五则Windows V
    推荐教程[图文]CorelDRAW经典教
    推荐教程[图文]蓝色人物绘制教程
    推荐教程[图文]韩式风格教程之油
    推荐教程[图文]AI进阶教程之月亮
    推荐教程XP中可以被禁用的服务对
    为你的网页做出电影的过
    在Fireworks中实现复杂
    网站项目管理规范手册
    coreldraw制作家具公司
    企业网站建设

    多图激赏:Windows V

    CSS实现星级效果总结

    廿五则Windows Vist

    可控声音 flash 教程
    (只显示最新10条。评论内容只代表网友观点,与本站立场无关!)