我要投稿
  • 您当前的位置:57365.com -> 技术教程 -> 网站建设教程 -> CSSHTML教程 -> 教程内容
  • [ 收藏本页教程 ]
  • 无边框窗口代码详解CSSHTML教程

    教程作者:佚名    教程来源:不详   教程栏目:CSSHTML教程    收藏本页
    /*代码思路
    此代码会以fullscreen方式打开一个空白窗口,然后用window.resize改变其大小。
    最后在以写入onload="location.replace='url'"的办法将网址改变。
    打开的窗口会是一个带有FRAME的窗口,其中窗口顶端会有一个高22的框架网页。
    此网页是用来操纵窗口移动及关闭。
    */

    /*说明
    代码分两个部分,但总共牵涉到5个HTML文件及4个图像文件
    第一部分是用来打开窗口,放在哪个文件都无所谓。
    第二部分是用来控制窗口的移动及关闭,必须放在指定的文件里。
    在此代码里,5个html文件分别为:
    1.html; 代码第一部分所在
    load.html; 所打开的窗口,是一个框架网页
    chromelesstit.html;代码第2部分所在
    contacting.html;用来显示如'PAGE LOADING.."等临时信息的网页
    main.html;真正的主网页
    4个图像分别为
    x_a.gif; active
    x_d.gif; mouseDown
    x_o.gif; mouseOver
    以上三个文件分别代表关闭窗口图标的不同状态
    none.gif; 用来遮盖chromelesstit.html
    */

    /*使用方法
    如果你想让一个文件,如1.html,中的某一个连接打开一个指像main.html的无边框窗口。
    把代码第一部分放到该文件中。
    然后将连接
    <a herf="main.html">
    改为
    <a herf="#" onclick="doOpen()">
    在该文件所在目录内
    1.建立
    chromelesstit.html;
    contacting.html;
    load.html;
    等三个文件,其HTML代码见本文所附。(不要做任何修改)
    2.建立
    一个名为images的目录(注意大小写,与有则不用),将
    http//lain.oso.com.cn/x_a.gif;
    http//lain.oso.com.cn/x_d.gif;
    http//lain.oso.com.cn/x_o.gif;
    http//lain.oso.com.cn/none.gif;
    这4个文件拷入改目录.
    对于初学者,以上则足够了。如果想要更好的效果,自己改代码。
    */
    <!--//代码第一部分。
    function doOpen(){
    theurl="main.html";
    wname ="name";
    w=750;
    h=400;
    /* 参数说明:
    theurl="main.html"; 打开窗口的网址
    wname ="name"; 打开窗口的name属性
    w=750; 打开窗口的宽度
    h=400; 打开窗口的高度
    */
    open(theurl, wname, w, h);
    };
    function open(theURL, wname, W, H) {
    var windowW = W;//确定网页的宽度
    var windowH = H;//确定网页的高度
    var windowX = Math.ceil( (window.screen.width - windowW) / 2 );
    var windowY = Math.ceil( (window.screen.height - windowH) / 2 );//确定网页的坐标

    if (navigator.appName == "Microsoft Internet Explorer" && parseInt(navigator.appVersion)>=4) isie=true; else isie=false;
    s = ",width="+W+",height="+H;
    if (isie===false){//加入对Nescape系列浏览器的支持
    splashWin = window.open( "main.html" , wname, "fullscreen=1,toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0"+s)
    splashWin.resizeTo( Math.ceil( W )    , Math.ceil( H ) )
    splashWin.moveTo ( Math.ceil( windowX ) , Math.ceil( windowY ) )
    }else{
    splashWin = window.open( "" , wname, "fullscreen=1,toolbar=0,location=0,directories=0,status=0,menubar=0,scrollbars=0,resizable=0"+s)
    splashWin.resizeTo( Math.ceil( W )    , Math.ceil( H ) )
    splashWin.moveTo ( Math.ceil( windowX ) , Math.ceil( windowY ) )
    splashWin.document.open("text/html", "replace");
    splashWin.document.write("<html><style type='text/css'>\n");
    splashWin.document.write("body{border: 1px solid #000000; overflow: hidden; margin: 0pt;}");
    splashWin.document.write("#stillloadingDiv {position: absolute; left: 0px; top: 0px; width: 100%px; height: 19px; z-index: 1; background-color: #C0C0C0; layer-background-color: #C0C0C0; clip:rect(0,100%,19,0);}");
    splashWin.document.write("</style>\n");
    splashWin.document.write("<body onload=\"top.document.location.replace('load.html")\" TOPMARGIN=0 LEFTMARGIN=0 MARGINWIDTH=0 MARGINHEIGHT=0 scroll='no'>");
    splashWin.document.write("<div id=stillloadingDiv><table width=100% height=22 cellspacing=0 cellpadding=0><tr><td align=left valign=middle width=100%><FONT size=1 face=verdana color=#000000>&nbsp;&nbsp;System energizing ...</font></td></tr></table></div>");
    splashWin.document.write("</body></html>");
    splashWin.document.close();
    }
    splashWin.focus();//代码第一部分完
    }//-->



    chromelesstit.html 文件代码

    <html><head>
    <meta http-equiv=Content-Type content=text/html;charset=windows-1252>
    <style type=text/css>
    #mywindowTITLE { position: absolute; left: 0px; top: 0px; width: 100%; height: 22px; z-index: 1; background-color: #ffffff; clip:rect(0,100%,22,0); }
    #mywindow { position: absolute; left: 0px; top: 0px; width: 100%; height: 22px; z-index: 2; clip:rect(0,100%;22,0); }
    #mywindowCLOSE { position: absolute; left: -22px; top: -22px; width: 11px; height: 11px; z-index: 3; clip:rect(0,11,11,0); }
    </style>
    <script language=javascript type=text/javascript>
    // Chromeless window v1.1 (TITLE)
    //////////////////////////////////////////////////////////////// Title bar control //////

    var isinit   = false;
    var mywindowok = true;


    theURL="main.html"
    windowCERRARa = "images/x_a.gif"
    windowCERRARd = "images/x_d.gif"
    windowCERRARo = "images/x_o.gif"
    windowTIT    = "<font face=Arial size=1>Title</font>"
    windowBORDERCOLOR  = "#000000"
    windowBORDERCOLORsel = "#FF8A00"
    windowTITBGCOLOR   = "#d7dcd9"
    windowTITBGCOLORsel = "#ffffff"

    var windowCERRARImg_a = new Image(); windowCERRARImg_a.src=windowCERRARa;
    var windowCERRARImg_d = new Image(); windowCERRARImg_d.src=windowCERRARd;
    var windowCERRARImg_o = new Image(); windowCERRARImg_o.src=windowCERRARo;


    function whaitborders(){
    if ( parent.chromewinb && parent.chromewinl && parent.chromewinr ){
    parent.chromewinb.document.bgColor=windowBORDERCOLOR
    parent.chromewinl.document.bgColor=windowBORDERCOLOR
    parent.chromewinr.document.bgColor=windowBORDERCOLOR
    }else{
    setTimeout('whaitborders()', 100);
    }
    }
    whaitborders()

    //////////////////////////////////////////////////////////////// MOUSE MOVE //////

    function mouseSTATUS(){
    this.x    = null;
    this.y    = null;
    this.bt   = "up";
    this.oldx  = null;
    this.oldy  = null;
    this.dx   = null;
    this.dy   = null;
    this.screeny = null;
    this.screenx = null;

    this.element = null;
    this.event  = null;
    }

    var mouse = new mouseSTATUS();

    function actualizateMouseSTATUS(e){
    if (!e) var e = event
    if ( (e.type=="mousedown" || e.type=="mouseup") && e.button!=1) return true

    var x=e.x+document.body.scrollLeft
    var y=e.y+document.body.scrollTop

    mouse.x  = x;
    mouse.y  = y;

       if ( e.type == "mousedown" ) mouse.bt = "down";
    else if ( e.type == "mouseup" )  mouse.bt = "up";

    if (window.event){
    mouse.screenx=window.event.screenX;
    mouse.screeny=window.event.screenY;
    }else{
    mouse.screenx=-1;
    mouse.screeny=-1;
    }

    }


    function initMouseEvents(){
    document.onmousedown = actualizateMouseSTATUS
    document.onmousemove = actualizateMouseSTATUS
    document.onmouseup  = actualizateMouseSTATUS
    document.onselectstart = selectstart
    document.ondragstart  = new Function("actualizateMouseSTATUS(event); return false;")
    }

    function selectstart(){
    if ( event.srcElement.tagName != "INPUT" && event.srcElement.tagName != "TEXTAREA"){return false;}
    else{mouse.bt="up"; return true;}
    }

    initMouseEvents()

    //////////////////////////////////////////////////////////////// WINDOW DRAG //////

    var mywindowbt  ="up";
    var wincloseSTATUS="up";

    var o
    我要投稿   -   广告合作   -   关于本站   -   友情连接   -   网站地图   -   联系我们   -   版权声明   -   设为首页   -   加入收藏   -   网站留言
    Copyright © 2009 - 20012 www.www.hxswjs.com All Rights Reserved.57365.com 版权所有