搜索
查看: 14818|回复: 0

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

[复制链接]
发表于 2020-9-25 16:45:29 | 显示全部楼层 |阅读模式
1、首先是固定值,打开的网址,页面高宽,都是固定的,需要在页面多次调用的解决方案。! O+ e  w* Q% r2 a. _" D2 N1 F
JS部分:
( k, v! l( @$ j# b
  1. <script LANGUAGE="JavaScript">
    4 a! Y6 A! O: r1 O' o( c
  2. function openwin(){
    ' Z& h7 e1 h! i5 ?) E
  3. var iWidth = 800;                         //弹出窗口的宽度;3 p% z* r% `! l8 X  u% q
  4. var iHeight = 600;                        //弹出窗口的高度;  j9 }% O8 A. y5 N6 d* w- i
  5. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;& z* Z! S% \8 k
  6. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;* M5 D( p2 L; I: ~) i
  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');
    3 _8 S: q, ^: l3 g
  8. }       
    7 U& h& u  i5 B3 ], F- t2 f
  9. </script>
复制代码
  参数解释:  
1 \9 D8 M! z' p% q  C7 z  <SCRIPTLANGUAGE="javascript">js脚本开始;+ L, \( F4 s3 l: `+ ?8 z
  window.open弹出新窗口的命令;$ v1 J5 Z/ ~7 D% u
  'page.html'弹出窗口的文件名;
1 {; {" ~3 b& M5 Z& d2 O  '网页标题'弹出窗口的名字(不是文件名),非必须,可用空''代替;
$ g# O7 ]9 O/ X/ x% }  iWidth = 800窗口高度;
& M; A' E3 A% J5 K5 x4 N, h: ^  iHeight = 600窗口宽度;
6 p" A1 O) o. d4 L5 m) ~. B; \# [  top=0窗口距离屏幕上方的象素值;  E2 J% `. _- K% X4 p
  left=0窗口距离屏幕左侧的象素值;; b9 N7 c& Z# m, P1 D% V
  toolbar=no是否显示工具栏,yes为显示;% B* @* {  X) F6 ~
  menubar,scrollbars表示菜单栏和滚动栏。
. L( Y7 h. f, K) S! c, _/ J0 C/ ~  resizable=no是否允许改变窗口大小,yes为允许;2 \: }# f  E$ x5 h  H0 U
  location=no是否显示地址栏,yes为允许;# u  @" u* t1 s' q; H
  status=no是否显示状态栏内的信息(通常是文件已经打开),yes为允许;" v" \3 A5 W/ ^# L/ E  u: `' X6 x
  </SCRIPT>js脚本结束4 Q+ l2 v* b6 C. f( C  \7 e
7 \# F' Y# ]" c1 M; E
调用:
5 Y0 [" h1 x: h) J5 A
  1. <a href="#" οnclick="openwin()">打开一个新的固定高宽的中间窗口</a>
复制代码
2 l# K3 F# x: B& U6 U7 `. H/ h

& G# h, j3 N/ E" v2、非固定值,就是调用程序,打开的页面高宽都不是固定的值。6 O7 d! j: ^# }1 V9 [
JS部分:. ~+ A+ c$ L) v
  1. function openwin(url,name,iWidth,iHeight)
    " p/ p( V. K% [
  2. {# ^: l0 \/ k2 x: M/ n
  3. var url;                            //转向网页的地址;
    ' j. \  X: |% M8 ^
  4. var name;                           //网页名称,可为空;: Y! c/ s' B5 X( }. d$ H: h/ h
  5. var iWidth;                         //弹出窗口的宽度;
    9 C9 Q' A4 E7 g3 R' H& R
  6. var iHeight;                        //弹出窗口的高度;
    ; T3 z9 B4 j1 }/ @1 f3 ?6 M; r
  7. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;! V9 W. ?: F1 N# X1 v9 J8 f
  8. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;
    4 C! o+ l: w$ _3 ]% ^
  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');
    ; ~1 Z# y2 v2 X3 S8 |2 X. r
  10. }
复制代码
调用:5 k+ x: K1 D! i- A# {9 ]
  1. <a href="javascript:void(0);" οnclick="javascript:openwin('page.html','页面标题',800,600);">打开一个新的固定高宽的中间窗口</a>
复制代码
这样做得好处是可以在a标签里面随意赋值。5 u9 f7 |$ E. g, J- C
回复

使用道具 举报

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

本版积分规则

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

虾皮社区,成立十年了!

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

Copyright © 2007-2019 xp6.org Powered by Discuz

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