JavaScript 打开弹出窗口

2020-02-10 - JavaScript

Javascript弹出窗口脚本有时对于将弹出窗口添加到页面很有用。当用户单击链接时,将打开一个新窗口并显示一个页面。

HTML

<a href="/index.html" onclick="return openWindow(this, {width:790,height:450,center:true})">打开新窗口</a>

有一些可选的可选参数作为第二个对象参数传递给此Javascript打开窗口函数(如上所示):

{
    width //宽度
    height //高度
    left //X坐标
    top //Y坐标
    center //中央
    name //名称
    scrollbars //滚动条
    menubar //菜单栏
    locationbar //位置栏
    resizable //可调整大小
}

源码

/**
*
*  Javascript open window
*
**/

function openWindow(anchor, options) {

    var args = '';

    if (typeof(options) == 'undefined') { var options = new Object(); }
    if (typeof(options.name) == 'undefined') { options.name = 'win' + Math.round(Math.random()*100000); }

    if (typeof(options.height) != 'undefined' && typeof(options.fullscreen) == 'undefined') {
        args += "height=" + options.height + ",";
    }

    if (typeof(options.width) != 'undefined' && typeof(options.fullscreen) == 'undefined') {
        args += "width=" + options.width + ",";
    }

    if (typeof(options.fullscreen) != 'undefined') {
        args += "width=" + screen.availWidth + ",";
        args += "height=" + screen.availHeight + ",";
    }

    if (typeof(options.center) == 'undefined') {
        options.x = 0;
        options.y = 0;
        args += "screenx=" + options.x + ",";
        args += "screeny=" + options.y + ",";
        args += "left=" + options.x + ",";
        args += "top=" + options.y + ",";
    }

    if (typeof(options.center) != 'undefined' && typeof(options.fullscreen) == 'undefined') {
        options.y=Math.floor((screen.availHeight-(options.height || screen.height))/2)-(screen.height-screen.availHeight);
        options.x=Math.floor((screen.availWidth-(options.width || screen.width))/2)-(screen.width-screen.availWidth);
        args += "screenx=" + options.x + ",";
        args += "screeny=" + options.y + ",";
        args += "left=" + options.x + ",";
        args += "top=" + options.y + ",";
    }

    if (typeof(options.scrollbars) != 'undefined') { args += "scrollbars=1,"; }
    if (typeof(options.menubar) != 'undefined') { args += "menubar=1,"; }
    if (typeof(options.locationbar) != 'undefined') { args += "location=1,"; }
    if (typeof(options.resizable) != 'undefined') { args += "resizable=1,"; }

    var win = window.open(anchor, options.name, args);
    return false;

}

- END -

17
0

Javascript 颜色转换

Javascript 颜色转换

此Javascript库将帮助您在不同颜色系统之间转换颜色。它支持RGB,HSV,CMYK颜色编码系统。首先,您需要创建要转换 ...

setInterval 时间事件

setInterval 时间事件

setInterval()方法setInterval()间隔指定的毫秒数不停地执行指定的代码语法window.setInterval(“javascriptfunction”,milliseconds); ...

Javascript 文件加载

Javascript 文件加载

当您只想在加载某一个javascript文件时才加载外部javascript文件时,此对象很有用。这样,您将形成某种可链接的java ...

canvas 用法

canvas 用法

<!DOCTYPEhtml><html><head><title>charsvideo</title><metacharset="utf-8"></head><body><can ...

jquery.zTree 异步加载机制解析

jquery.zTree 异步加载机制解析

异步加载设置varsetting={async:{enable:true,url:"http://host/getNode.php",autoParam:["id"]}};以POST的方式访问url地址 ...

获取路径

获取路径

获取路径functiongetDOCBasePath(docUrl,confUrl){returngetBasePath(docUrl||self.document.URL||self.location.href,confUrl);}functionallPrpos(obj){// ...