jQuery弹出可关闭遮罩层：http://hovertree.com/texiao/layer/1/

代码如下：

<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8" />

<title>jQuery对话框右上角带关闭× - 何问起</title><base target="_blank" />

<!-- Attach our CSS -->

<link rel="stylesheet" href="http://hovertree.com/texiao/layer/1/reveal.css">

<!-- Attach necessary scripts -->

<script type="text/javascript" src="http://down.hovertree.com/jquery/jquery-1.4.4.min.js"></script>

<script type="text/javascript" src="http://hovertree.com/texiao/layer/1/jquery.reveal.js"></script>

<style type="text/css">

body {

font-family: "HelveticaNeue","Helvetica-Neue", "Helvetica", "Arial", sans-serif;

}

.big-link {

display: block;

margin-top: 50px;

text-align: center;

font-size: 30px;

background-color:#eeeeee;

color: #06f;

}

.hovertreeinfo{text-align:center;} .hovertreeinfo a{color:darkcyan;}

</style>

</head>

<body>

<div class="hovertreeinfo">

<h1>jQuery弹出可关闭层提示框</h1>

</div>

<a href="http://hovertree.com/h/bjaf/ati6k7yk.htm" class="big-link" data-reveal-id="myModal">

Demo 1

</a>

<a href="http://hovertree.com/hvtart/bjae/lhnydfey.htm" class="big-link" data-reveal-id="myModal" data-animation="fade">

Demo 2

</a>

<a href="http://hovertree.com/hvtart/bjae/vgte3y3a.htm" class="big-link" data-reveal-id="myModal" data-animation="none">

Demo 3

</a>

<div id="myModal" class="reveal-modal">

<h1>jquery导出层</h1>

<p>This is a default modal in all its glory, but any of the styles here can easily be changed in the CSS.

推荐使用Demo 1，和Demo 3两种方式。何问起 hovertree.com

</p>

<a class="close-reveal-modal">×</a>

</div>

<div class="hovertreeinfo">推荐使用Demo 1，和Demo 3两种方式.

<br />

<a href="http://hovertree.com/h/bjaf/tishiceng.htm">原文</a> <a href="http://hovertree.com">首页</a>

<a href="http://hovertree.com/texiao/">特效</a>

<br />by 何问起

hovertree.com

<br />

<!--<img src="http://hovertree.com/texiao/layer/1/modal-gloss.png" />-->

</div>

</body>

</html>

转自：http://hovertree.com/h/bjaf/tishiceng.htm

特效库：http://www.cnblogs.com/roucheng/p/texiao.html

jQuery对话框右上角带关闭×的更多相关文章

  1. Jquery对话框基本配置

    p.p1 { margin: 0.0px 0.0px 0.0px 0.0px; font: 18.0px "PingFang SC" } p.p2 { margin: 0.0px ...

  2. 炫酷的jQuery对话框插gDialog

    js有alert,prompt和confirm对话框,不过不是很美体验也不是很好,用jQuery也能实现, 体验效果:http://hovertree.com/texiao/jquery/34/ 代码 ...

  3. WPF 右上角带数字的按钮

    效果如图所示 三种方案, 1:不改控件模版,布局实现,死开 2:改button模版,利用附加属性,附加附加属性,功能多了话,不利于拓展 3:继承button,添加依赖属性,接下来是这种 1:新建类 为 ...

  4. jquery弹出可关闭遮罩提示框

    jquery CSS3遮罩弹出层动画效果,使用非常简单,就两个标签,里面自定义内容和样式,四种常见效果,懂的朋友还可以修改源代码修改成自己想要的效果 效果展示 http://hovertree.com ...

  5. jQuery对话框插件 ThickBox

    http://baike.haosou.com/doc/7607201-7881296.html 项目已经停止维护,但该插件还是不错的! ThickBox是一个基于JQuery类库的扩展,它能在浏览器 ...

  6. VC++ MFC子对话框建立与关闭

    主窗体 void CMoshiwindowDlg::OnButton1() { // TODO: Add your control notification handler code here CDi ...

  7. jQuery EasyUI实现全部关闭tabs

    有时,当我们打开很多tabs当标签,要关闭一个接一个,它只能被关停 显然太麻烦,能够在选项卡的最右边加入一个button 实现关闭所有. 代码例如以下: <!DOCTYPE HTML PUBLI ...

  8. 实现jquery EasyUI tabs选项卡关闭图标后载入自己定义事件

    当关闭tabs选项卡时,底部footer须要通过javascript又一次定位calcFooter(),怎样实现呢?选项卡上的关闭图标的方法是easyui自带的,calcFooter()写在onClo ...

  9. JQuery弹出Dialog关闭方式close vs destroy

    $editDialog.iDialog('close')  $(this).dialog('close'); 等Close方法关闭Dialog时,Dialog并不是完全消失,只是隐藏起来.两个Dial ...

随机推荐

  1. 浅谈WEB安全性（前端向）

    相信进来的时候你已经看到alert弹窗,显示的是你cookie信息(为配合博客园要求已删除).单纯地在你的客户端弹出信息只是类似于迫使你在自己的房间脱衣服——没人看得到,自然也不算啥恶意行为.那么如果 ...

  2. SOA相关资料整理分享

    昨@幸福框架同学问能否推荐SOA一些资,.想想之前看过不少资料文档,就整理分享下,有需要的可以参考下. 文章链接 理解面向服务的体系结构中企业服务总线场景和解决方案,第 1 部分 SOA 和 web ...

  3. [ASP.NET MVC 小牛之路]03 - Razor语法

    本人博客已转移至:http://www.exblr.com/liam  Razor是MVC3中才有的新的视图引擎.我们知道,在ASP.NET中,ASPX的视图引擎依靠<%和%>来调用C#指 ...

  4. C# MVC 项目下的路由配置-RouteConfig

    1. 设置备份全局路径下的路由 目的,我们在网站中域名后面输入参数,可以跳转到相应的controller,例如:www.innovsys.cn/dd.直后端直接跳转到controller,获取dd参数 ...

  5. 支持向量机（SVM）复习总结

    摘要: 1.算法概述 2.算法推导 3.算法特性及优缺点 4.注意事项 5.实现和具体例子 6.适用场合 内容: 1.算法概述 其基本模型定义为特征空间上的间隔最大的线性分类器,即支持向量机的学习策略 ...

  6. CentOS6编译安装PHP7+Nginx

    本文属于动手搭建PHP开发环境的一部分,更多点击链接查看. 本文以centos6为例. 安装PHP 下载 http://cn2.php.net/distributions/php-5.6.22.tar ...

  7. JavaScript必须了解的知识点总结。

    整理的知识点不全面但是很实用. 主要分三块: (1)JS代码预解析原理(包括三个段落): (2)函数相关(包括 函数传参,带参数函数的调用方式,闭包): (3)面向对象(包括 对象创建.原型链,数据类 ...

  8. VMware 中如何打开U盘弹出U盘或者移动硬盘的（两种方法）

    1.U盘如下,插入后都是直接在win里面显示的 2.选择连接u盘 3.u盘就可以在虚拟机里面显示了 4.弹出则选择断开连接 扩展:如果无效:请参考这种方法 (给虚拟机分配一个临时硬盘,然后设置这个临时 ...

  9. Win10+VS2015+EF6.0+MySQL5.6+MVC环境部署和排错

    本来已经好几个月不弄专业了,今天一哥们问我问题的时候重新捣鼓了一下,就做个文档供后来人参考吧~ 1.首先安装MySQL 5.6 安装很简单我就不说了,你参考下:http://jingyan.baidu ...

  10. Dnsmasq安装与配置

    默认的情况下,我们平时上网用的本地DNS服务器都是使用电信或者联通的,但是这样也导致了不少的问题,首当其冲的就是上网时经常莫名地弹出广告,或者莫名的流量被消耗掉导致网速变慢.其次是部分网站域名不能正常 ...