玩转 Javascript 弹出窗口, 居中与居角扩大窗口至屏幕最大值 By shawl.qiu

注意: 拷贝代码后需要 查找 "/ ", 并替换为 "/". (不加引号)
原因: CSDN 的编码器在行末自动添加空格符" ", 而这段代码正好使用 js 的 / 在行末作为行链接, 因此行末就是空格, 而不是 /, 需要手动转正.  

玩转 Javascript 弹出窗口, 居中与居角扩大窗口至屏幕最大值 By shawl.qiu


说明:
主要使用 Js 的 setInterval() 和 clearInterval() 函数完成操作.

目录:
1. 居中弹出窗口, 并逐步扩大
2. 居角弹出窗口, 并逐步扩大
3. 附加: 双击滚屏, 单击停止, 以 Scroll bar 的相对位置滚屏

shawl.qiu 
2006-10-24
http://blog.csdn.net/btbtd

1. 居中弹出窗口, 并逐步扩大
  1. linenum
  2. <script type="text/javascript">
  3. //<![CDATA[
  4.     if (navigator.appName=="Microsoft Internet Explorer") {
  5.         //最大化窗口
  6.         self.moveTo(-5,-5)
  7.         self.resizeTo(screen.availWidth +8,screen.availHeight+8)
  8.         //这个脚本定义的宽度其实比原窗口还要大那么一点.
  9.     }
  10.  
  11.     var w=h=200;
  12.     x=(screen.width-w)/2;
  13.     y=(screen.height-h)/2;
  14.     var n=open('','newWin','width='+w+',height='+h+',left='+x+',right='+x+',top='+y+',bottom='+y);
  15.         n.document.write('/
  16.         <script>/
  17.             document.write("temp"); /* 临时内容, 去掉出错 */ /
  18.             document.body.innerHTML=""; /* 清空页面内容 */ /
  19.             document.οnclick=function(){ close();} /* 单击关闭窗口 */ /
  20.         <//script>');
  21.         n.document.write('<h2>test moving window</h2>');
  22.         n.focus();
  23.         
  24.     var timer=setInterval('fMovingWin()',1);
  25.     
  26.     function fMovingWin(){
  27.         if (n.closed||(w>=screen.width+8&&h>=screen.height+8)) {
  28.             clearInterval(timer);
  29.             return;
  30.         }
  31.         try{
  32.             if(w<=screen.width+8)w+=2;
  33.             if(h<=screen.height+8)h+=2;
  34.             n.resizeTo(w, h)
  35.             x=(screen.width-w)/2;
  36.             y=(screen.height-h)/2;
  37.             n.moveTo(x,y)
  38.         } catch(e) {} //shawl.qiu script
  39.     }
  40.  
  41. //]]>
  42. </script>

2. 居角弹出窗口, 并逐步扩大
  1. linenum
  2. <script type="text/javascript">
  3. //<![CDATA[
  4.     if (navigator.appName=="Microsoft Internet Explorer") {
  5.         //最大化窗口
  6.         self.moveTo(-5,-5)
  7.         self.resizeTo(screen.availWidth +8,screen.availHeight+8)
  8.         //这个脚本定义的宽度其实比原窗口还要大那么一点.
  9.     }
  10.  
  11.     var w=h=200;
  12.     x=y=-5;
  13.     var n=open('','newWin','width='+w+',height='+h+',left='+x+',right='+x+',top='+y+',bottom='+y);
  14.         n.document.write('/
  15.         <script>/
  16.             document.write("temp"); /* 临时内容, 去掉出错 */ /
  17.             document.body.innerHTML=""; /* 清空页面内容 */ /
  18.             document.οnclick=function(){ close();} /* 单击关闭窗口 */ /
  19.         <//script>');
  20.         n.document.write('<h2>test moving window</h2>');
  21.         n.focus();
  22.         
  23.     var timer=setInterval('fMovingWin()',1);
  24.     
  25.     function fMovingWin(){
  26.         if (n.closed||(w>=screen.width+8&&h>=screen.height+8)) {
  27.             clearInterval(timer);
  28.             return;
  29.         }
  30.         try{
  31.             if(w<=screen.width+8)w+=2;
  32.             if(h<=screen.height+8)h+=2;
  33.             n.resizeTo(w, h)
  34.             
  35.             //从右下角逐步扩大窗口
  36. /*             x=screen.width-w
  37.             y=screen.height-h
  38.             n.moveTo(x,y) */
  39.             
  40.             //从左上角逐步扩大窗口
  41.             n.moveTo(x,y)
  42.         } catch(e) {}  //shawl.qiu script
  43.     }
  44.  
  45. //]]>
  46. </script>

3. 附加: 双击滚屏, 单击停止, 以 Scroll bar 的相对位置滚屏
  1. linenum
  2. <script type="text/javascript">
  3. //<![CDATA[
  4.     function scb(){ timer=setInterval('scrollBy(0,1)',1000) }
  5.     document.οnmοusedοwn=function(){ try{ clearInterval(timer);} catch(e){} }
  6.     document.οndblclick=function(){ scb(); }
  7. //]]> //shawl.qiu script
  8. </script>


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值