整合营销服务商
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
电脑端+手机端+微信端=数据同步管理
免费咨询热线：
TML+CSS+JS自主设计弹出窗口的方法，在线编辑器
html弹出一个小窗口的方法可能有很多，就比如本站（笨鸟工具-璞玉天成，大器晚成）的导航栏点击之后会有一个小窗口（小页面）弹出，然后文章页面的底部有两个小图标，当鼠标悬放在上面的时候，也可以弹出一个小窗口，然后点击下方实例代码的试一试按钮，也可以弹出一个小窗口，是本站提供的HTML+css+javascript的在线编辑器。这里介绍的一简单的方法和一种自主设计的方法，不需要很复杂的程序设计，也不需要框架，用javascript和css就可以：
HTML+CSS+JS自主设计弹出窗口的方法，在线编辑器
这个方法需要结合html、css和javascript三种语言，即web三件套全得用上。该方法的原理就是将本来的窗口的style中display设置为none，当点击按钮之后，设置为block，并为该窗口绑定位置，实例代码如下：
<div id="ck1"><p style='text-align:center;line-height:80px;'>这个窗口，可以说是自己设计的了，可以在这里添加其它的标签和功能</p></div>
<button class='btn btn-default' onclick='show2()'>点击弹出自己设计的小窗口</button>
<style>
#ck1{display:none;position:fixed;top:20%;left:20%;width:50%;height:80px;z-index:9999;background-color:skyblue;border-radius:5px;}
</style>
<script>
function show2(){
document.getElementById("ck1").style.display = "block";
}
</script>HTML+CSS+JS自主设计弹出窗口的方法，在线编辑器
这个自主设计的方法中，除了display属性的设置之外，另一个关键点在于z-index值的设置，html元素的排列堆叠，不仅有水平方向、竖直方向，还有深度方向，就像立体的直角坐标系当中，不仅有x轴、y轴，还有z轴，即z-index的设置可以修改div或html元素的z轴位置。
原文地址：html怎么弹出一个小窗口，自主设计方法，在线编辑器 - HTML教程
击右上方红色按钮关注“小郑搞码事”，每天都能学到知识，搞懂一个问题！
大家好！我是/小郑搞码事/的小郑
今天和大家分享一下JS如何操作浏览器窗口。只讲如何打开一个新窗口
先来看效果图
上面这个图界面效果就是我们要实现的。
我们常常需要创建一个新窗口，用来向用户显示额外的信息，同时又避免他们正在阅读的信息消失。从实现方案上来看，尽管我们可以用HTML打开一个新的浏览器窗口，但是使用JavaScript可以对新窗口的内容和特性进行更多的控制。
接下来，我们看一下怎么实现的
定义一个打开新窗口的函数newWindow。如上面代码所示，变量catWindow包含一个新的窗口对象，这个对象引用图像文件icon.png，这个新窗口的名称是catWin，必须设置名称，因为我们以后可能希望在a或另一个脚本中引用这个窗口。新窗口的宽度是350像素，高度是260像素，位置是左边400，上边400。
页面中，包含一个onload事件处理程序，它调用newWinLinks函数，newWinLinks循环遍历页面上的a，检查是否有任何a包含class属性值newWin。如果有，就设置这个a元素的onclick事件处理程序，从而，当点击这个a时，调用newWindow函数。
总结一下
需要注意两个地方：
1、newWindow中，在宽度和高度参数中的逗号之间不能有任何空格，如果有空格，那么脚本可能在某些浏览器中无效，总地来说，当脚本出现错误，需要进行高度时，要首先查找这样的小问题。
2、比如向窗口中添加参数时，希望窗口具有工具栏，地址栏，滚动条
toolbar=yes,location=yes,scrollbars=yes
参数默认是no，可以不填。当然浏览器上表现也有不同，需要知道。
图1
图2
图3
*请认真填写需求信息，我们会在24小时内与您取得联系。
