搜索
查看: 14706|回复: 0

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

[复制链接]
发表于 2020-9-25 16:45:29 | 显示全部楼层 |阅读模式
1、首先是固定值,打开的网址,页面高宽,都是固定的,需要在页面多次调用的解决方案。+ D, X; g$ G5 X% ]# N+ H5 Y
JS部分:1 F/ d9 R% v' e1 O+ o3 z( b/ S
  1. <script LANGUAGE="JavaScript">1 h- V7 |7 ~! O8 |- y9 k
  2. function openwin(){
    & l5 T/ {0 p2 R  m
  3. var iWidth = 800;                         //弹出窗口的宽度;
    " G; h+ g+ a# J% R" P  ~
  4. var iHeight = 600;                        //弹出窗口的高度;
    6 `1 B; J( d. Q2 ~6 {( u) V
  5. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;+ r; c* W# O, y8 s4 i! F
  6. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;0 V4 b: j, 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'); 0 u* Y7 z0 v5 z' i6 S/ I  l. T3 G
  8. }        * `4 b* h. I9 t
  9. </script>
复制代码
  参数解释:  
- m0 x( @2 K8 d) w) w+ h  <SCRIPTLANGUAGE="javascript">js脚本开始;
9 r% E7 f% }  X  window.open弹出新窗口的命令;
: C, o  |) ^. m3 Z! z  'page.html'弹出窗口的文件名;
& U3 y: }; z5 {  '网页标题'弹出窗口的名字(不是文件名),非必须,可用空''代替;/ H# k- O' P1 V2 a" F% s
  iWidth = 800窗口高度;+ a3 X6 u( M9 y3 A5 g0 o1 V
  iHeight = 600窗口宽度;  U! i- O) d& M( ]6 v% y7 v3 x
  top=0窗口距离屏幕上方的象素值;  [% b1 r9 A3 X( k$ A( B
  left=0窗口距离屏幕左侧的象素值;
  x3 h3 N7 V  |) w2 v: \  toolbar=no是否显示工具栏,yes为显示;3 r  V, D4 ^9 R- |( C1 F9 k
  menubar,scrollbars表示菜单栏和滚动栏。6 n  b& t7 i& S4 Z7 h5 M
  resizable=no是否允许改变窗口大小,yes为允许;; A: s; e$ r- i6 {# k. t
  location=no是否显示地址栏,yes为允许;
. C" E% w# ^4 M  r* n& Y  status=no是否显示状态栏内的信息(通常是文件已经打开),yes为允许;3 M* |+ f2 \7 S
  </SCRIPT>js脚本结束
' E9 t* V: i/ {4 L! P, {
$ T' _! Z2 a4 B2 |, [+ _1 h调用:, I3 {( K  r. c. P- P
  1. <a href="#" οnclick="openwin()">打开一个新的固定高宽的中间窗口</a>
复制代码
, V- {7 s: C* T0 p  C
; E9 M2 V2 _% L! c6 W3 P/ ~8 s! `
2、非固定值,就是调用程序,打开的页面高宽都不是固定的值。& I+ w4 j5 S( k0 g0 }
JS部分:
5 N$ W  {* p4 H2 s" Q, N& h
  1. function openwin(url,name,iWidth,iHeight)6 `5 w9 }8 u* v( r( Y
  2. {. N# V/ }4 `. [8 O5 b
  3. var url;                            //转向网页的地址;
    + F. N6 Y8 R+ P8 }( \  T0 t
  4. var name;                           //网页名称,可为空;
    0 o- H; |7 \$ s) p: I: ?# g. K
  5. var iWidth;                         //弹出窗口的宽度;
    % p0 o  ~& e4 h. r  d
  6. var iHeight;                        //弹出窗口的高度;
    : _/ B# }" w* C9 O; ~0 v
  7. var iTop = (window.screen.availHeight-30-iHeight)/2;       //获得窗口的垂直位置;
    - c# c6 u2 K# {/ D5 a. D6 A  R3 y
  8. var iLeft = (window.screen.availWidth-10-iWidth)/2;        //获得窗口的水平位置;) U& b! r& @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');  S$ E' \7 _; R) H9 g. p  b
  10. }
复制代码
调用:. P# A+ Q5 E6 Q$ X# t' a
  1. <a href="javascript:void(0);" οnclick="javascript:openwin('page.html','页面标题',800,600);">打开一个新的固定高宽的中间窗口</a>
复制代码
这样做得好处是可以在a标签里面随意赋值。3 C, Q- _5 o1 o" [, V  M4 e. _
回复

使用道具 举报

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

本版积分规则

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

虾皮社区,成立十年了!

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

Copyright © 2007-2019 xp6.org Powered by Discuz

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