简单js弹出div

最新推荐文章于 2024-07-18 13:52:01 发布
最新推荐文章于 2024-07-18 13:52:01 发布
阅读量674 收藏
点赞数
分类专栏： js 文章标签： div dialog stylesheet button function xhtml

test.html

------------------------------------

<%@ Page Language="VB" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="_Default" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
     <title>Untitled Page</title>
     <link href="css/StyleSheet.css" rel="stylesheet" type="text/css" />
     <script type="text/javascript" src="js/JScript.js"></script>
</head>
<body>
     <form id="form1" runat="server">
     <div>
         <input id="Button1" type="button" value="button" οnclick="popUp('d1',false);" />
        
     </div>
     </form>
</body>
</html>

js/javascript.js

------------------------------------------------------------

// JScript File
function popUp(id,isModal)
{
    var dialog=document .createElement("div");
    dialog .className="dialog";
    dialog .id=id;
    dialog .ico=document .createElement("img");
    dialog .ico.className="dialog_icon";
    dialog .ico .dialog=dialog;
    dialog .ico.οnclick=hideDialog;
    dialog.ico.setAttribute("src","imgs/close.gif");
    dialog .appendChild(dialog .ico);
    if(isModal)
    {
    dialog .modalLayer=document .createElement("div");
    dialog .modalLayer.className="modal";
    dialog .modalLayer.appendChild(dialog);
    document .body .appendChild(dialog .modalLayer);
    dialog.modalLayer.style.display='block';
    }
    else
    {
    dialog .className+=' non-modal';
    document .body .appendChild(dialog);
    }
}
function hideDialog(e)
{
var dialog=this.dialog;
if(dialog)
{
   if(dialog .modalLayer)
   {
   dialog .modalLayer.style.display='none';
   }
   else
   {
   dialog .style.display='none';
   }
}
}

css/stylesheet.css

-------------------------------------------------------------------

body
{
    background-color:Blue;
}
.dialog
{
     position: fixed;
     width: 300px;
     height: 200px;
     border: solid black 1px;
     top: 100px;
     left: 150px;
     background-color:Orange;
}
.modal
{
     position: fixed;
     top: 0px;
     left: 0px;
     width: 100%;
     height: 100%;
     filter: Alpha(opacity=90);
     background-color: White;
}
.non-modal
{
}
.dialog_icon
{
     float: right;
     right: 0px;
     width: 44px;
     height: 18px;
      cursor:hand;
}
digmouse
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
js弹出div并显示遮罩层
10-26
弹出div显示遮罩层的效果，想必大家都有见到过吧，下面有个示例，大家可以参考下
javaScript弹div框
JeelonXu.feng
04-06 1119
/*该死的需求,js弹出div框*/  function MessageBox() { this.titleheight = "15"; // 提示窗口标题高度 this.bordercolor = "green"; // 提示窗口的边框颜色 this.titlecolor = "red"; // 提示窗口的标题颜色 this.titlebgc
js控制div弹出层实现方法
10-24
主要介绍了js控制div弹出层实现方法,可实现点击链接弹出div浮动层,且背景色变暗的效果,是一款非常实用的特效源码,需要的朋友可以参考下
js实现div弹出层的方法
10-25
在JavaScript中，实现一个div弹出层是一项常见的任务，特别是在构建交互式Web应用时。本篇将详细解析如何使用原生JavaScript来创建一个功能完备的div弹出层，包括使其可拖拽、可关闭，并允许用户自定义显示效果。 ...
js弹出div demo
01-27
总的来说，js弹出div是JavaScript在网页交互中常用的一种技术，它利用了HTML和CSS的组合，结合JavaScript的动态特性，为用户提供了一种自定义且灵活的提示方式。通过不断学习和实践，开发者可以创造出更加符合用户...
Js弹出div窗口完美版
05-12
摘要:脚本资源,Ajax/JavaScript,弹出层　收集的JAVAsCRIPT弹出DIV层窗口的实例，引入了jquery-1.4.1.min.js，实例中有一个无边框iframe完美遮罩演示。这些网页特效对于平时的前端设计用处非常大，学习之后也能提高你...
web前端基础面试85题（一）
柯晓楠
07-18 482
1、什么是HTML语义化？<基本上都是围绕着几个主要的标签，像标题（H1~H6）、列表（li）、强调（strong em）等等>根据内容的结构化（内容语义化），选择合适的标签（代码语义化）便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。2、为什么要语义化？为了在没有CSS的情况下，页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看；用户体验：例如title、alt用于解释名词或解释图片信息、label标签的活用；
数据分析的核心技能和方法
07-19
数据分析的核心技能和方法
毕业设计javajsp人寿保险销售网站(ssh)-qkrp源码含文档工具包
07-19
毕业设计javajsp人寿保险销售网站(ssh)-qkrp源码含文档工具包 后台是ssh框架，页面是jsp，数据库mysql，jdk1.8，开发工具用ecplise、myecplise、sts、idea都可以 平湖人寿保险公司保险销售网站分为用户和管理员两个部分 前台部分（用户界面）： 1、资讯浏览功能： （1）新闻资讯浏览 （2）新闻资讯查询 （3）公司简介 （4）通知公告 2、用户登录注册功能： （1）注册 （2）登录 3、用户管理功能 （1）个人信息管理 （2）订单管理 4、保险购买功能： （1）保险产品浏览 （2）保险产品查询 （3）保险产品购买 后台管理（管理员界面） 1、管理员登录功能： 管理员在管理员登录界面输入用户名和密码，即可登录管理员的界面。 2、资讯管理功能： （1）新闻资讯管理 （2）公司简介管理 （3）通知公告管理 3、保险产品管理： （1）保险产品信息管理 （2）保险产品查询 4、会员管理： （1）会员删除 （2）会员级别管理 5、统计管理： （1）保险产品销售量统计 （2）有效会员数量统计 包含：源码、数据库脚本、论文、环境工具包、相同框架项目的安装教程
毕业设计javajsp公共课考试系统(ssh)-qlkrp源码工具包
07-19
毕业设计javajsp公共课考试系统(ssh)-qlkrp源码工具包 后台是ssh框架，页面是jsp，数据库mysql，jdk1.8，开发工具用ecplise、myecplise、sts、idea都可以 题库 试卷信息管理 阅卷 统计功能 包含：源码、数据库脚本、环境工具包、相同框架项目的安装教程（在说明文档中）
揭秘黑箱：YOLO预测结果的可解释性探究
07-19
YOLO（You Only Look Once）是一种流行的实时对象检测系统，最初由 Joseph Redmon 等人在 2015 年提出。它的核心思想是将对象检测任务视为一个回归问题，直接从图像像素到边界框坐标和类别概率的映射。YOLO 以其快速和高效而闻名，特别适合需要实时处理的应用场景。 以下是 YOLO 的一些关键特点： 1. **单次检测**：YOLO 模型在单次前向传播中同时预测多个对象的边界框和类别概率，不需要多次扫描图像。 2. **速度快**：YOLO 非常快速，能够在视频帧率下进行实时检测，适合移动设备和嵌入式系统。 3. **端到端训练**：YOLO 模型可以从原始图像直接训练到最终的检测结果，无需复杂的后处理步骤。 4. **易于集成**：YOLO 模型结构简单，易于与其他视觉任务（如图像分割、关键点检测等）结合使用。 5. **多尺度预测**：YOLO 可以通过多尺度预测来检测不同大小的对象，提高了检测的准确性。 YOLO 已经发展出多个版本，包括 YOLOv1、YOLOv2（也称为 YOLO9000）、YOLOv3、YOLOv4 和 YOLOv5 等。
吃鸡pubg适用于罗技GHUB的鼠标宏
07-19
安装步骤如下！ 导入lua宏到GHUB的步骤如下： 1. 打开GHUB，选择你的罗技鼠标。 2. 转到“宏”选项卡，创建一个新的宏。 3. 在宏编辑器中，点击“导入”，选择"pubg1.lua"文件。 4. 宏会自动加载lua文件中的所有操作，你可以调整它们的顺序或延迟时间，以适应自己的游戏风格。 5. 将这个宏绑定到鼠标上的任意按键，就可以在游戏中使用了
基于海洋捕食者优化算法MPA-VMD实现信号去噪目标函数为包络信息熵 包络熵 排列熵 样本熵最小附matlab代码.rar
07-19
1.版本：matlab2014/2019a/2021a 2.附赠案例数据可直接运行matlab程序。 3.代码特点：参数化编程、参数可方便更改、代码编程思路清晰、注释明细。 4.适用对象：计算机，电子信息工程、数学等专业的大学生课程设计、期末大作业和毕业设计。 5.作者介绍：某大厂资深算法工程师，从事Matlab算法仿真工作10年；擅长智能优化算法、神经网络预测、信号处理、元胞自动机等多种领域的算法仿真实验，更多仿真源码、数据集定制私信+。 替换数据可以直接使用，注释清楚，适合新手
工业控制系统安全测评指导书（二级）
最新发布
07-20
工业控制系统安全测评指导书（二级）
基于springboot+jsp的毕业生信息管理系统数据库表
07-19
设计一个毕业生信息管理系统，可实现管理员、辅导员、学生用户进行登录的系统，去除掉一些不必要的功能并添加一些新的功能使得页面更加简洁，用户可简单直接地进行操作该系统，并且更好地使用该系统，从而对毕业生的信息进行更好的管理。
高分项目-基于SpringBoot框架实现的旧物置换网站（包含全套源码 + 数据库sql + 论文）.zip
07-19
高分项目-基于SpringBoot框架实现的旧物置换网站（包含全套源码 + 数据库sql + 论文）
基于Springboot的自习室管理和预约系统设计与实现论文
07-19
传统信息管理方式存在显著不足，首先耗时较长，其次数据错误率较高，且错误数据更正难度大，最后数据检索过程也颇为繁琐费力。因此，引入自习室管理和预约系统软件，旨在发挥其高效信息处理的能力，以优化信息管理流程，使管理工作更加系统化和程序化。同时，该系统的有效运用还能助力管理人员准确快速地处理信息。 在开发自习室管理和预约系统时，我们对于开发工具的选择尤为谨慎。为了便于开发与实现，我们选择了IDEA作为开发工具，并采用Mysql作为数据库工具。以此为基础搭建的开发环境，成功实现了自习室管理和预约系统的多项功能，包括管理员对用户和新闻公告的管理。 自习室管理和预约系统是一款基于软件开发技术精心打造的应用系统，它在信息处理方面展现出卓越的性能。无论是数据添加、数据维护与统计，还是数据查询等处理需求，该系统都能轻松胜任，展现出其强大的处理能力。
《AI大模型应用》--基于 Azure OpenAI API 和 gpt-35-turbo 模型的一个简易聊天网站.zip
07-19
个人深耕AI大模型应用领域积累的成果，希望对您有所帮助。有大模型账号、环境问题、AI大模型技术应用落地方案等相关问题，欢迎详聊，能为您解决问题是我的荣幸！ 个人深耕AI大模型应用领域积累的成果，希望对您有所帮助。有大模型账号、环境问题、AI大模型技术应用落地方案等相关问题，欢迎详聊，能为您解决问题是我的荣幸！ 个人深耕AI大模型应用领域积累的成果，希望对您有所帮助。有大模型账号、环境问题、AI大模型技术应用落地方案等相关问题，欢迎详聊，能为您解决问题是我的荣幸！ 个人深耕AI大模型应用领域积累的成果，希望对您有所帮助。有大模型账号、环境问题、AI大模型技术应用落地方案等相关问题，欢迎详聊，能为您解决问题是我的荣幸！ 个人深耕AI大模型应用领域积累的成果，希望对您有所帮助。有大模型账号、环境问题、AI大模型技术应用落地方案等相关问题，欢迎详聊，能为您解决问题是我的荣幸！
自监督学习：YOLO模型性能提升的新前沿
07-19
YOLO（You Only Look Once）是一种流行的实时对象检测系统，最初由 Joseph Redmon 等人在 2015 年提出。它的核心思想是将对象检测任务视为一个回归问题，直接从图像像素到边界框坐标和类别概率的映射。YOLO 以其快速和高效而闻名，特别适合需要实时处理的应用场景。 以下是 YOLO 的一些关键特点： 1. **单次检测**：YOLO 模型在单次前向传播中同时预测多个对象的边界框和类别概率，不需要多次扫描图像。 2. **速度快**：YOLO 非常快速，能够在视频帧率下进行实时检测，适合移动设备和嵌入式系统。 3. **端到端训练**：YOLO 模型可以从原始图像直接训练到最终的检测结果，无需复杂的后处理步骤。 4. **易于集成**：YOLO 模型结构简单，易于与其他视觉任务（如图像分割、关键点检测等）结合使用。 5. **多尺度预测**：YOLO 可以通过多尺度预测来检测不同大小的对象，提高了检测的准确性。 YOLO 已经发展出多个版本，包括 YOLOv1、YOLOv2（也称为 YOLO9000）、YOLOv3、YOLOv4 和 YOLOv5 等。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值