搜索
查看: 13667|回复: 0

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

[复制链接]
发表于 2020-9-25 16:45:29 | 显示全部楼层 |阅读模式
1、首先是固定值,打开的网址,页面高宽,都是固定的,需要在页面多次调用的解决方案。
% w# r* c; s  g" h# t  m0 iJS部分:# V3 n  g& _0 [- B9 ?1 x+ J% `$ H
  1. <script LANGUAGE="JavaScript">- [: L" L. V4 M8 W; L6 G! Q/ y' A
  2. function openwin(){
    3 B# Q/ D: T1 m/ E/ @( I0 A  B) E
  3. var iWidth = 800;                         //弹出窗口的宽度;( {& D6 P& J$ J. Z
  4. var iHeight = 600;                        //弹出窗口的高度;; Q. C* y; G& |+ [7 \0 w
  5. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;
    1 ?; y7 h, E( N
  6. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;
    ' f' H+ u( R/ q* r
  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 G* e5 z) Y* p9 j3 q
  8. }       
    2 e+ |' X2 K4 k9 q# y" W% f9 e
  9. </script>
复制代码
  参数解释:  $ c" W0 u; o8 f  |
  <SCRIPTLANGUAGE="javascript">js脚本开始;
) v+ S: A& G1 i4 M  window.open弹出新窗口的命令;
& p1 R/ I9 Y) V0 ~1 _, t  'page.html'弹出窗口的文件名;- C! W- K1 n8 C
  '网页标题'弹出窗口的名字(不是文件名),非必须,可用空''代替;
0 T4 I1 _/ u2 h0 w2 R  iWidth = 800窗口高度;
2 q. e! k3 W: a( O; |  iHeight = 600窗口宽度;# ~2 c% |9 {! t3 ]/ @5 {) M
  top=0窗口距离屏幕上方的象素值;
/ X( S1 `$ H6 H- @5 m7 p+ _# e1 e  left=0窗口距离屏幕左侧的象素值;7 W2 k2 R  w4 X* P
  toolbar=no是否显示工具栏,yes为显示;* H) ]- z& i& q" l+ S0 U, ~- [
  menubar,scrollbars表示菜单栏和滚动栏。
* r' n! q; Y4 I; Z  resizable=no是否允许改变窗口大小,yes为允许;
- u" T: X) T2 m; p/ F  location=no是否显示地址栏,yes为允许;7 A; ]" D+ P- q" w' V3 s
  status=no是否显示状态栏内的信息(通常是文件已经打开),yes为允许;
) r9 P! f; t8 p  R* H8 s% y  </SCRIPT>js脚本结束/ m8 n. P# z' T0 e) |
' x' O& I+ {: U& b* u2 H
调用:( w3 m8 J; w& ~+ L& y4 g. k+ q
  1. <a href="#" οnclick="openwin()">打开一个新的固定高宽的中间窗口</a>
复制代码
7 y: Q3 c, ~6 `; Q: S

, g, G6 f2 p! r  |" @. @$ f2、非固定值,就是调用程序,打开的页面高宽都不是固定的值。+ A0 I& N1 {: m1 K* z
JS部分:
" ]. _9 w9 l1 U, A
  1. function openwin(url,name,iWidth,iHeight)- k0 E5 w2 m' Q; z
  2. {
    . y7 V8 v; e& |) L% P& Z" p
  3. var url;                            //转向网页的地址;
    3 S$ Q" i, m; C1 \0 u3 ^: G
  4. var name;                           //网页名称,可为空;9 {( D# l$ E! o" y$ T+ K
  5. var iWidth;                         //弹出窗口的宽度;
      v& s2 R# \4 K; w
  6. var iHeight;                        //弹出窗口的高度;
    8 O+ A8 k" A# p, U) {
  7. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;
    ! m5 a& Q; T' d$ X8 S! r
  8. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;5 K" g, E- }8 P+ n5 {) g* |
  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');
    : l9 M0 \0 h7 Z' v: N  q. m
  10. }
复制代码
调用:2 I% |: ^" F  l7 N! {& c) A
  1. <a href="javascript:void(0);" οnclick="javascript:openwin('page.html','页面标题',800,600);">打开一个新的固定高宽的中间窗口</a>
复制代码
这样做得好处是可以在a标签里面随意赋值。& [& I* |3 i* a# [( r' J
回复

使用道具 举报

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

本版积分规则

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

虾皮社区,成立十年了!

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

Copyright © 2007-2019 xp6.org Powered by Discuz

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