搜索
查看: 14165|回复: 0

[网站] js打开一个新窗口固定大小并且居中显示

[复制链接]
发表于 2020-9-25 16:45:29 | 显示全部楼层 |阅读模式
1、首先是固定值,打开的网址,页面高宽,都是固定的,需要在页面多次调用的解决方案。" v- r( C8 g' J! `# f- Z
JS部分:  X+ B  z6 }& G/ i' ^" }1 I
  1. <script LANGUAGE="JavaScript"># V, k! J( c" A9 Y
  2. function openwin(){
    6 K  I& D6 V0 g) Q  [+ H" ^
  3. var iWidth = 800;                         //弹出窗口的宽度;
    , w8 H2 U7 R5 V; j, L* C3 k& e# D
  4. var iHeight = 600;                        //弹出窗口的高度;' j. I  x8 b, u: F+ G' f
  5. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;. k$ b- y7 o! f9 R
  6. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;! N; j9 Y( F: x1 k/ r. g
  7. window.open("page.html","网页标题",'height='+iHeight+',,innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no'); 6 F. ?8 u- {; Q( f+ ~
  8. }       
    : }, _' m; R' V; v
  9. </script>
复制代码
  参数解释:  
1 _2 u- b: @# u' B0 R  <SCRIPTLANGUAGE="javascript">js脚本开始;
& }4 X3 B7 V3 C; g  window.open弹出新窗口的命令;# s  P* F! t! T4 G+ O
  'page.html'弹出窗口的文件名;2 V: ~* M3 {; C7 Y/ E3 c4 q- ]
  '网页标题'弹出窗口的名字(不是文件名),非必须,可用空''代替;% l" _& X' v0 x% {4 F6 u. U4 C
  iWidth = 800窗口高度;
' w. F+ I* K7 p2 m  iHeight = 600窗口宽度;
" ~  f9 ?9 y1 @. E( i* D- t  top=0窗口距离屏幕上方的象素值;- V+ a8 l' h5 R. ?, u5 B$ w- ^& I
  left=0窗口距离屏幕左侧的象素值;
; a5 @3 d5 ?7 n: J+ p& e# d  toolbar=no是否显示工具栏,yes为显示;
0 m: S5 B( p# V$ A  menubar,scrollbars表示菜单栏和滚动栏。% }( n9 e9 {5 ?' \# k: r
  resizable=no是否允许改变窗口大小,yes为允许;
) M. U. ]! b2 I) n( ]: z( I  location=no是否显示地址栏,yes为允许;2 i5 ~* Z. ^7 v
  status=no是否显示状态栏内的信息(通常是文件已经打开),yes为允许;8 J) W/ ]9 {. `6 R( G# ~
  </SCRIPT>js脚本结束& k: J: W) `; N# P# p' r, ~( g( _

. A- Z/ D( p4 }调用:
+ ^0 d$ c' P: }
  1. <a href="#" οnclick="openwin()">打开一个新的固定高宽的中间窗口</a>
复制代码

+ N8 _) Q. q0 ~$ E0 e! T
. I) U0 p* a. K( i) P" _2、非固定值,就是调用程序,打开的页面高宽都不是固定的值。! h# E/ ~/ s. V. p; B2 }  g1 ~
JS部分:& l# J6 C) K/ [7 C' {
  1. function openwin(url,name,iWidth,iHeight): \3 h& E" K+ f1 z2 E: _% O
  2. {4 G, _$ b% P. h8 V5 U5 x& k1 I
  3. var url;                            //转向网页的地址;
    ( U  C, X' q8 ~0 o! s1 \& n1 o
  4. var name;                           //网页名称,可为空;
    2 N* ?0 A& m; F( a" M9 c
  5. var iWidth;                         //弹出窗口的宽度;: T' q8 X1 ^" c; C
  6. var iHeight;                        //弹出窗口的高度;: }! Y; h5 D' m
  7. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;
    9 g6 T! {) `$ G& v+ i4 S
  8. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;& e% n" _" A; D  h! K5 n
  9. window.open(url,name,'height='+iHeight+',,innerHeight='+iHeight+',width='+iWidth+',innerWidth='+iWidth+',top='+iTop+',left='+iLeft+',toolbar=no,menubar=no,scrollbars=auto,resizeable=no,location=no,status=no');4 S; E7 B$ h$ v2 s+ i7 j
  10. }
复制代码
调用:# N5 e8 l1 V& V6 ?: X* E8 M! a' t) g
  1. <a href="javascript:void(0);" οnclick="javascript:openwin('page.html','页面标题',800,600);">打开一个新的固定高宽的中间窗口</a>
复制代码
这样做得好处是可以在a标签里面随意赋值。1 T) i- y& }! P1 b! m/ X/ j- i5 S
回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

热议作品
精华帖子排行
精彩推荐

虾皮社区,成立十年了!

站长自己也搞不懂想做个什么,反正就是一直在努力的做!

Copyright © 2007-2019 xp6.org Powered by Discuz

QQ|Archiver|手机版|小黑屋|虾皮社区 鲁公网安备 37021102000261号 |网站地图
返回顶部 返回列表