先创建一个窗体

<div data-role="popup" id="popupView" class="ui-content" data-overlay-theme="b" data-position-to="window" data-dismissible="false">
  <a href='javascript:void(0)' data-rel="back" class="ui-btn ui-corner-all ui-shadow ui-btn-a ui-icon-delete ui-btn-icon-notext ui-btn-right">Close</a>
  <div>弹出窗内容<div>
</div>

1)点击后弹出

<a href="#popupView" data-rel="popup" data-transition="flip" class="ui-btn ui-corner-all">按钮</a>

2)页面加载后弹出

//页面延时加载
<script>
setTimeout(function () {
  $("#popupView").popup('open');
}, 1000);//1秒
</script>

关键字说明:

data-overlay-theme: 背景色透明灰
data-position-to: 弹窗在窗口居中显示
data-dismissible: 是否允许单击窗口外任一位置关闭窗口(默认true为允许)
data-transition: 弹出方式
												

jquery Mobile弹出窗的更多相关文章

  1. jQuery制作弹出窗(模态框)

    来源:(二少)在南极 ##index.html <!DOCTYPE html><html lang="zh"><head> <meta c ...

  2. jquery ui dialog弹出窗 清空缓存Cache或强制刷新

    我用jquery ui 弹出一个购物车的对话,通过AJAX加载的数据.发现购物车被缓存,一直看到是旧数据.为了刷新购物车更新,我必须去加一个刷新按钮,点击后更新购物车页面.有没有一种方法来自动刷新加载 ...

  3. Jquery和Javascript 实际项目中写法基础-弹出窗和弹出层 (4)

     一.实际项目中有很多如下界面效果.    二.该效果可以归结为弹出窗或者弹出层来实现的,为什么这么说?看如下代码:      <!DOCTYPE html> <html> & ...

  4. bootstrap-data-target触发模态弹出窗元素的data使用 data-toggle与data-target的作用 深入ASP.NET MVC之九:Ajax支持 Asp.Net MVC4系列--进阶篇之AJAX

    bootstrap-data-target触发模态弹出窗元素的data使用 时间:2017-05-27 14:22:34      阅读:4479      评论:0      收藏:0      [ ...

  5. Bootstrap模态弹出窗

    Bootstrap模态弹出窗有三种方式: 1.href触发模态弹出窗元素: <a class="btn btn-primary" data-toggle="moda ...

  6. jquery制作弹出层带遮罩效果,点击阴影部分层消失

    jquery制作弹出层带遮罩效果,点击阴影部分层消失. 整体还是比较简单的. HTML代码很简单 <a href="#" class="big-link" ...

  7. js简单显示和隐藏div,触发超链接,动态更改button值,setInterval()简单使用,jquery easyui弹出框简单使用 .

    js简单显示和隐藏div .<!DOCTYPE html> .<html> .<head> .<meta charset="UTF-8"& ...

  8. jQuery Dialog弹出层对话框插件

    Dialog.js的相关注释已经添加,可以按照注释,进行相关样式的修改,适用于自定义的各个系统! dialog.js /** * jQuery的Dialog插件. * * @param object ...

  9. iOS:模态弹出窗控制器UIPopoverPresentationController

    模态弹出窗控制器:UIPopoverPresentationController 实质:就是将内容控制器包装成PopoverPresentationController的形式,然后再模态出来,必须指定 ...

随机推荐

  1. 机器学习:异常检测算法Seasonal Hybrid ESD及R语言实现

    Twritters的异常检测算法(Anomaly Detection)做的比较好,Seasonal Hybrid ESD算法是先用STL把序列分解,考察残差项.假定这一项符合正态分布,然后就可以用Ge ...

  2. ELK修炼之道

    看了ELK大半年了,现在就慢慢的总结一下对ELK的理解 参考资料 ELK stack中文指南 Elasticsearch权威指南 官方文档 Elasticsearch基础篇 此篇用于介绍Elastic ...

  3. javadoc 生成文档注释

    我们可以通过 javadoc 命令从文档注释中提取内容,生成程序的 API 帮助文档. javadoc -d doc demo.java 文档注释:/******/ @author 标明开发该类模块的 ...

  4. Linux C Programing - Arguments(2)

    #include <iostream> #include <stdlib.h> #include <stdio.h> //printf #include <u ...

  5. Unity中Collider和刚体Collider性能对比

    测试方式: 每个对象做大范围正弦移动,创建1000-5000个对象,保证场景分割树的实时更新,并测试帧率 测试脚本: 移动脚本: using UnityEngine; using System.Col ...

  6. CentOS7 续

    网络环境 第一步:通过cmd查询自己本机的IP,然后记录下来,手工配置到本地连接上面IP:子网掩码:DNS1:101.7.8.9DNS2:202.38.184.13 第二步:给物理机 本地连接配置第二 ...

  7. CentOS7 基础配置

    Centos 7 部分>>>>>>>>>>>>>>>>>>>>>>& ...

  8. IIS 7中 ISAPI 错误解决

    在本地IIS种发布了一个测试网站,浏览的时候提示 404 错误,无法显示页面,具体错误如下: 解决办法如下: 选择IIS根目录,在右边的功能视图中选择 “ISAPI 和 CGI限制”,双击打开, 把相 ...

  9. Codeforces 720A. Closing ceremony

    A. Closing ceremony time limit per test 2 seconds memory limit per test 256 megabytes The closing ce ...

  10. Gitblit Go

    1.Download the "Gitblit Go" package from the www.gitblit.com 2.UnZip the package 3.Open th ...