弹窗图片代码（弹出图片代码）

本篇文章给大家谈谈弹窗图片代码，以及弹出图片代码对应的知识点，希望对各位有所帮助，不要忘了收藏本站喔。

本文目录一览：

• 1、求一段html弹窗代码。点击一个小图片，网页居中弹出一张大图？如图
• 2、弹出窗口的html的代码是怎么写的?
• 3、求ASP 弹出图片链接的代码
• 4、求一个html 图片弹窗的 代码?

求一段html弹窗代码。点击一个小图片，网页居中弹出一张大图？如图

网页链接

我给你一个地址，菜鸟教程Javascript这儿有图片弹窗的实例

弹出窗口的html的代码是怎么写的?

1、最基本的弹出窗口代码

SCRIPT LANGUAGE="javascript"

!--

window.open ("page.html")

--

/SCRIPT 

window.open ("page.html") 用于控制弹出新的窗口page.html，如果page.html不与主窗口在同一路径下，前面应写明路径，绝对路径(http://)和相对路径(../)均可。

2、经过设置后的弹出窗口

SCRIPT LANGUAGE="javascript"

!--

window.open ("page.html", "newwindow", "height=100, width=400, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no")nbsp;

-

/SCRIPT

SCRIPT LANGUAGE="javascript" js脚本开始；window.open 弹出新窗口的命令；"page.html" 弹出窗口的文件名；"newwindow" 弹出窗口的名字（不是文件名），非必须，可用空"代替；

3、用函数控制弹出窗口

script LANGUAGE="JavaScript"

!--

function openwin() {

window.open ("page.html", "newwindow", "height=100, width=400, toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")

}

--

/script

这里定义了一个函数openwin(),函数内容就是打开一个窗口。

4、同时弹出2个窗口

script LANGUAGE="JavaScript"

!--

function openwin() {

window.open ("page.html", "newwindow", "height=100, width=100, top=0, left=0,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")

nbsp;

window.open ("page2.html", "newwindow2", "height=100, width=100, top=100, left=100,toolbar=no, menubar=no, scrollbars=no, resizable=no, location=no, status=no")

}

--

/script

为避免弹出的2个窗口覆盖，用top和left控制一下弹出的位置不要相互覆盖即可。

5、主窗口打开文件1.htm，同时弹出小窗口page.html

script language="javascript"

!--

function openwin() {

window.open("page.html","","width=200,height=200")

}

--

/script

求ASP 弹出图片链接的代码

直接将下述代码插入到html的head内部（根据情况修改部分参数即可）

因为弹窗会有被屏蔽的风险（同时也是一种令人讨厌的方式），故采用页面弹出层的方式。

style type="text/css"

//弹出层样式，可根据情况自行修改位置信息

#ADImgBox{

display:block;

position:absolute;

z-index:999;

left:0;

top:10%;

width:100%;

background:transparent;

border:0;

margin:0 auto;

padding:0;

text-align:center;

}

#ADImgBox a,#ADImgBox a:hover{

border:0;

padding:0;

margin:0 auto;

text-decoration:none;

}

#ADImgBox a img{

border:0;

}

/style

script type="text/javascript"

var imgShowTime = 5; //图片停留时间

var imgSrc = ""; //图片地址

var imgUrl = ""; //图片链接地址

var winLoad = window.onload; //存储原有的onload程序，防止覆盖

window.onload = function(){

//插入Html代码

var box = document.createElement("div");

box.setAttribute("id","ADImgBox");

box.innerHTML = "a href='"+ imgUrl +"'img src='"+ imgSrc +"'//a";

document.body.appendChild(box);

//定时

window.setTimeout(function(){

document.body.removeChild(document.getElementById("ADImgBox"));

}, imgShowTime*1000);

//原来的onload

try{

winLoad();

}catch(e){}

};

/script

求一个html 图片弹窗的 代码?

!DOCTYPE html

html

head lang="en"

    meta charset="UTF-8"

    title/title

    script src="jquery-3.2.1.min.js"/script

    style

    /style

/head

body

div style="width:250px;height:150px;background-color:#ff6600;"小图/div

div style="position:fixed;top:0px;left:0px;height:100%;width:100%;overflow:hidden;background-color:rgba(0,0,0,0.5);display:none;"

    div style="width:500px;height:300px;background-color:#ff6600;position:fixed;top:50%;left:50%;margin-left:-250px;margin-top:-150px"

        大图

    /div

/div

/body

/html

script

$(document).ready(function(){

    $("div").eq(0).click(function(){

        $("div").eq(1).show();

    });

    $("div").eq(1).click(function(){

       $(this).hide();

    });

})

/script

弹窗图片代码的介绍就聊到这里吧，感谢你花时间阅读本站内容，更多关于弹出图片代码、弹窗图片代码的信息别忘了在本站进行查找喔。