模态窗口 javascript 脚本

最新推荐文章于 2021-05-31 00:23:19 发布
最新推荐文章于 2021-05-31 00:23:19 发布
阅读量645 收藏
点赞数
分类专栏： 代码分享 文章标签： javascript dialog function iframe filter null
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/EasyFRMS/article/details/4197108
版权

代码示例：



调用示例


        var _frameDialog = new FrameDialog("noname1.html", 480, 450);
        _frameDialog.showDialog();


dialog.js 文件


FrameDialog = Class.create();

FrameDialog.prototype = {
 initialize : function(src, width, height) {
     this.src = src;
  this.width = width;
  this.height = height;
  if ($("EasyFRMS_ModalDialog")==null){
   var _dialogHTML = "<html><body scroll='no' bgcolor='#ffffcc'></body></html>";
   var _dialog = document.createElement("IFRAME");
    _dialog.id = "EasyFRMS_ModalDialog";
    _dialog.src = "about:blank";
    _dialog.frameBorder = 0;
   document.body.appendChild(_dialog);
   window.EasyFRMS_ModalDialog.document.open();
   window.EasyFRMS_ModalDialog.document.write(_dialogHTML);
   window.EasyFRMS_ModalDialog.document.close();
   $("EasyFRMS_ModalDialog").setStyle({"top":"0px","left":"0px","width":"0px","height":"0px","position":"absolute","visibility":"hidden","filter":"alpha(opacity=0)"});
  }
  if ($("EasyFRMS_ModalFrame")==null){
   var _dialog = document.createElement("IFRAME");
    _dialog.id = "EasyFRMS_ModalFrame";
    _dialog.src = this.src;
    _dialog.frameBorder = 0;
    _dialog.allowtransparency="true";
   document.body.appendChild(_dialog);
   $("EasyFRMS_ModalFrame").setStyle({"top":"0px","left":"0px","width":"0px","height":"0px","position":"absolute","visibility":"hidden","background-color":"transparent"});
  }else{
      $("EasyFRMS_ModalFrame").src = this.src;
  }
 },
 showDialog : function() {
  var _button_index = 1;
  var _dlgWidth = Math.max(document.body.scrollWidth,document.body.clientWidth);
  var _dlgHeight = Math.max(document.body.scrollHeight,document.body.clientHeight);
  var _freX = document.body.scrollLeft + document.body.clientWidth/2 - this.width/2;
  var _freY = document.body.scrollTop + document.body.clientHeight/2 - this.height/2;
  var _freWidth = this.width;
  var _freHeight = this.height;
  $("EasyFRMS_ModalDialog").alpha = 0;
  $("EasyFRMS_ModalDialog").setStyle({"top":"0px","left":"0px","width":_dlgWidth,"height":_dlgHeight,"visibility":"visible"});
  $("EasyFRMS_ModalFrame").setStyle({"top":_freY,"left":_freX,"width":_freWidth,"height":_freHeight,"visibility":"visible"});
  $("EasyFRMS_ModalDialog").timer = window.setInterval(this.showAlpha, 10);
  document.body.disabled = true;
 },
 closeDialog : function(){
  $("EasyFRMS_ModalDialog").setStyle({"visibility":"hidden"});
  $("EasyFRMS_ModalFrame").setStyle({"visibility":"hidden"});
  document.body.disabled = false;
 },
 showAlpha : function(){
  if ($("EasyFRMS_ModalDialog")!=null){
   $("EasyFRMS_ModalDialog").alpha += 10;
   $("EasyFRMS_ModalDialog").setStyle({"filter":"alpha(opacity=" + $("EasyFRMS_ModalDialog").alpha + ")"});
   if ($("EasyFRMS_ModalDialog").alpha>50){
    window.clearInterval($("EasyFRMS_ModalDialog").timer);
   }
  }
 }
}

EasyFRMS
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
EasyFRMS.Image C# 实现图片剪切、缩放、旋转、水印操作
EasyFRMS的专栏
04-25 3078
    ///     /// 功能：Shenxu 水印位置模式    /// 作者：Tianeyi 申栩    /// 日期：2009-03-18    ///     public enum PositionMode    {        None, TopLeft, TopRight, Middle, BottomLeft, BottomRight    }    ///     //
模态窗口js脚本
wuxiaobingandbob的专栏
03-02 442
js ="setTimeout(function(){document.getElementsByTagName('Button')[3].click()},100);" 处理模态窗口的方法    看到的记下吧    Ray神写的
html5自动填充父类框,使用HTML5原生对话框元素并轻松创建模态框组件
weixin_33179966的博客
05-31 139
HTML 5.2草案加入了新的dialog元素。但是是一种实验技术。以前，如果我们想要构建任何形式的模式对话框或对话框，我们需要有一个背景，一个关闭按钮，将事件绑定在对话框中的方式安排我们的标记，找到一种将消息传递出去的方式对话......这真的很复杂。对话框元素解决了上述所有问题。Bootstrap 模态框和原生模态框的对比下面是一个bootstrap模态框的html结构：开始演示模态框×模态框...
模态窗口中的脚本刷新
cpp2017(慕白兄)的专栏
03-01 1717
在模态窗口中，如果直接用document.location来刷新页面，会弹出一个新的窗口。解决的办法有很多种。善于思考人的就会发现，我点击链接或按纽就可以刷新，程序是不是也可以模拟呢。当然可以。这里给出几种常用办法。1.post方式刷新。   这个比较容易。   首先，页面中中必须有 base target="_self">base> 否则提交页面会新开一个窗口
易好文件资源管理系统 (EasyFRMS) 4.2.0 版本推出
EasyFRMS的专栏
10-04 1990
<br /><br />4.2.0 版本更新如下:<br /> - 类 Windows 资源管理器操作<br />   - 拖选文件,Ctrl 增加选择<br />   - 树图导航<br />   - 快捷键操作,全选,剪切,复制,粘贴<br />   - 文件拖拽移动<br />   - 分段读取<br />   - 快捷访问,快速定位<br />   - 文件快速预览<br />   - 用户私人存储空间<br /> - 更方便的搜索<br />   - 存储位置定位<br />   - 搜索模式(是
JavaScript 的模态窗口
12-25
在这个案例中，描述的是一个基于JavaScript实现的div式模态弹出窗口，这意味着它是通过修改HTML元素的CSS样式和JavaScript脚本来实现的，而非依赖浏览器内置的window.open()函数或其他外部插件。 模态窗口的实现...
使用div仿javascript模态窗口
08-07
首先，我们需要创建一个基本的HTML结构，包括`<head>`部分用于引入CSS样式和JavaScript脚本，以及`<body>`部分用于放置模态窗口的基础元素。在`<head>`中，我们可能需要引入一个外部CSS文件，例如`styles.css`，来...
有关javascript模态窗口的使用
03-16
JavaScript模态窗口是一种在网页上实现弹出式对话框的技术，通常用于显示警告、确认或输入信息等场景。模态窗口的特点是它会阻止用户与背景页面的交互，直到用户处理完当前窗口中的事务。本篇文章将深入探讨...
js模态窗口
10-15
JSer.modalDialog就是JSer脚本框架提供的一个模态窗口实现，它为网页添加了一个功能丰富的弹出窗口，并通过灰色背景遮罩来确保用户在关闭模态窗口前无法与页面其他部分交互。 JSer.modalDialog模态窗口的主要特点...
javascript调用的模态窗口
11-29
"javascript调用的模态窗口"是指使用JavaScript来创建或控制的一种弹出式窗口，这种窗口在显示时会阻止用户对父窗口的交互，直到用户关闭了模态窗口。这个功能在很多场景下都非常实用，比如表单验证、用户提示或者...
易好文件资源管理系统 (EasyFRMS) 进化史
EasyFRMS的专栏
10-04 2305
<br />1. EasyFRMS 1.0.0 (DimoIM.Net)<br /> <br />      2008 年 4 月的一天，我和合伙人(当时还没有合伙)还有两个老师朋友一起吃饭，其间他们说起了他们工作中遇到的问题，他们都是电教老师，学校机房由他们管理，而学校这样的传统行业总是会习惯性的认为所有于电脑有关的事情就都是他们的工作了，所以学校里的各种照片，视频等文件都是他们来管理，于是就经常发生这样是情况，晚上10点了，校长一个电话要什么什么照片，他们就需要登录学校 FTP 然后去一个目录一个目录的
推荐：敏捷软件开发：原则、模式与实践（C＃版）
EasyFRMS的专栏
06-24 510
推荐一本书，对大家也许会有帮助 简介 　　本书中，享誉全球的软件开发专家和软件工程大师Robert C. Martin深入而生动地使用真实案例讲解了面向对象基本原则、重要的设计模式、UML和敏捷实践等程序员必备的知识。 　　　　本书于2003年荣获第13届Jolt大奖，是C++和Java程序员提高自身水平的绝佳教材，也适于用作高校计算机、软件工程专业相关课程的教材或
文件资源管理系统用户模块设计
EasyFRMS的专栏
04-17 1132
      由于系统的潜在客户将涉及不同的行业、不同的规模、不同的用户，所以用户模块的设计就需要具备很好的灵活性及可扩展性，而且由于系统自身的特点决定，系统必须拥有一个完整的权限结构，这样才能确保用户只能进行经过授权的操作，据此需求设计如下：       用户信息的自定义      为了满足不同客户对用户信息的不同要求，系统中增加了用户扩展属性的结构，这样将可以帮助用户自由设定用户的信息内容。  
网络文件资源管理系统的计划设想
EasyFRMS的专栏
04-14 757
      通过 Web 应用系统为用户提供网络文件的集中管理、检索、分享服务，并提供开放接口和辅助客户端，然后利用开放接口实现网络相册、论坛、博客、数字图书馆、VOD点播、网络硬盘、文档管理、音乐库、网摘等各种扩展应用，以此来帮助用户构建一站式信息管理平台。       Web 主应用系统将采用 ASP.Net 开发 (由于采用 ASP.Net 将导致系统仅可运行于 Windows 平台
文件资源管理系统分类模块设计
EasyFRMS的专栏
04-21 1875
      系统的一个重要功能就是对文件资源的分类检索，所以拥有灵活强大的分类模块将显得非常的必要，为此系统将提供 3 种分类方式：扩展信息分类，文件类型分类，自定义分类。      扩展信息分类      系统可以通过程序自动获取文件的相关信息，并自动对其进行归类，此分类信息由程序自动进行不可被改变。例如：日期，照片拍摄的相机，型号，音乐的作者，专集，软件的开发公司等      文件类型
文件资源管理系统资源模块设计
EasyFRMS的专栏
04-23 1313
资源类型存储设备管理员可以设置指定路径为存储设备，存储设备可以有多个。并支持网络路径。例如：创建 图片库 指定路径为 D:/图片库文件包用户可以在许可权限的位置创建文件包(类似 Windows 系统的文件夹)。例如：在 图片库 中创建 我的照片目录文件用户提交的各类文件资源。例如：用户上传的照片、音乐资源权限创建文件包此权限针对存储设备、文件包，选中此项，系统允许用
易好文件资源管理系统
laugh888的专栏
08-03 729
随着国内软件行业的不断发展壮大,软件产品的代理业务也面临着新的挑战和机遇;面对行业的软件需求,存在着形形色色的解决方案,产品良莠不齐,报价相差悬殊,竞争混乱不堪;如何找到一款有核心竞争力的产品代理?       信息化的不断深入,软件产品分类越来越细;代理商面对所在城市地区,如何把自己有限的资金人脉资源专注于解决更多行业客户的软件需求?        各行各业都有不同软件产品的需求,你要选择那个行
网络文件资源管理系统的结构规范
EasyFRMS的专栏
04-15 830
语言编码      系统默认中文简体，采用 GB2312 字符集 命名法      不论C#、Delphi或Javascript还是CSS全部统一采用帕斯卡命名法，例如：FileManager.GetFiles(int ClassId, int Length)数据库命名      主表前加 DB_ 前缀，扩展应用表前加应用名称的2字母缩写      表及存储过程的命名全部用大写  
系统表示层布局设计
EasyFRMS的专栏
05-13 718
      根据系统的用户及功能应用等特点，决定参考开心网、CSDN、百度博客等类似系统进行设计。      系统页面的主要功能区为：标识区个人信息区应用导航区操作区      相关应用根据自身特点进行相应调整
JavaScript 模态对话框与全屏窗口操作代码示例
"javascript常用代码大全，包括打开模式对话框、获取模式对话框返回值、全屏打开IE窗口以及XML在JavaScript中的使用示例" 在JavaScript编程中，掌握一些常用的代码片段能够极大地提高开发效率。以下将详细介绍标题...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值