JS

api.openFrame({

                     name: 'showPic',

                     url: './showPic.html',

                     rect: {

                        //  x: api.pageParam.marginBottom,

                        //  y: api.pageParam.marginTop + api.pageParam.marginBottom,

                        //  w: api.winWidth - api.pageParam.marginBottom * 2,

                        //  h: api.winHeight - api.pageParam.marginTop - api.pageParam.marginBottom * 3

                        x: 0,

                        y: 0,

                        w: api.winWidth,

                        h: api.winHeight

                     },

                     pageParam: {

                         params: params

                     },

                     bounces: false,

                     bgColor: 'rgba(34,34,34,0.7)',

                     vScrollBarEnabled: false,

                     hScrollBarEnabled: false

                 });
showPic.html
<body>

  <div class="main">

    <img id="face" src="" /><br />

    <img id="back" src="" /><br />

    <div id="btn">关闭</div>

  </div>

</body>

css

html, body {

    background-color: transparent !important;

    overflow: hidden;

    width: 100%;

    height: 100%;

    font: normal 100% Helvetica, Arial, sans-serif;

    text-align: center;

    padding-top: 1em;

}

#main{

}

#face,#back{

  width: 18em;

  height: 18em;

}

#btn {

    background-color: #4363ab;

    color: #fff;

    text-align: center;

    padding: 0.5rem 1rem;

    width: 80%;

    border-radius: 0.2rem;

    margin: 2rem auto;

    font-weight:;

    font-size: 1.2rem

}

APIClound 弹出层 Frame的更多相关文章

  1. 弹出层在兼容模式和IE8模式下显示不正常

    弹出层在火狐.谷歌.360极速模式.IE6下都能100%面积正常显示,但在IE8和360的兼容模式下只显示弹出层下半部分或右半部分的内容,在主页面加上: <meta http-equiv=&qu ...

  2. Js弹出层，弹出框代码

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. Layer组件多个iframe弹出层打开与关闭及参数传递

    一.Layer简介 Layer是一款近年来备受青睐的web弹层组件,基于jquery,易用.实用,兼容包括IE6在内的所有主流浏览器,拥有丰富强大的可自定义的功能. Layer官网地址:http:// ...

  4. JavaScript学习笔记(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

    一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...

  5. JavaScript学习总结(一)——延迟对象、跨域、模板引擎、弹出层、AJAX示例

    一.AJAX示例 AJAX全称为“Asynchronous JavaScript And XML”(异步JavaScript和XML) 是指一种创建交互式网页应用的开发技术.改善用户体验,实现无刷新效 ...

  6. 弹出层layer的使用

    弹出层layer的使用 Intro layer是一款web弹层组件,致力于服务各个水平段的开发人员.layer官网:http://layer.layui.com/ layer侧重于用户灵活的自定义,为 ...

  7. zepto弹出层组件

    html: <!DOCTYPE html> <html> <meta charset="utf-8"> <title></ti ...

  8. 关于淘宝店铺装修弹出层popup的记录

    小龙最近做了一下下淘宝的店铺装修,里面封装的widget深不见底,刚刚整明白popup,也就是弹出层的使用方法,大神勿喷: <div class="area001">触 ...

  9. Fancybox丰富的弹出层效果

    Fancybox是一款优秀的jquery插件,它能够展示丰富的弹出层效果.前面我们有文章介绍了facybox弹出层效果,相比facybox,fancybox显得功能更为齐全,它除了可以加载DIV,图片 ...

随机推荐

  1. shell编程awk进阶

    awk操作符 算术操作符:  x+y, x-y, x*y, x/y, x^y, x%y      -x: 转换为负数      +x: 转换为数值 字符串操作符:没有符号的操作符,字符串连接 赋值操作 ...

  2. linux find grep tail

    如果在只是想匹配模式的上下几行,grep可以实现. $grep -5 'parttern' inputfile //打印匹配行的前后5行 $grep -C 5 'parttern' inputfile ...

  3. （转）redis分布式锁-SETNX实现

    Redis有一系列的命令,特点是以NX结尾,NX是Not eXists的缩写,如SETNX命令就应该理解为:SET if Not eXists.这系列的命令非常有用,这里讲使用SETNX来实现分布式锁 ...

  4. （转）EOSIO开发（四）- nodeos、keosd与cleos

    前一篇文章介绍了EOSIO中钱包.账户与账户权限的概念,这一篇文章继续学习EOSIO系统的主要组件,包括nodeos.keosd以及cleos. 本文执行的命令都是基于Docker环境,请先下载Doc ...

  5. NeuroNER+brat工具学习

    1.Brat:http://brat.nlplab.org/ 能够进行直觉标注.命名实体识别.关系标注.分块.共存标注.二元关系标注等(药物与药物).时间标注. 但是这个安装好麻烦啊... 2.

  6. Linux下修改MySQL数据库字符编码为UTF-8解决中文乱码

    由于MySQL编码原因会导致数据库出现乱码. 解决办法: 修改MySQL数据库字符编码为UTF-8,UTF-8包含全世界所有国家需要用到的字符,是国际编码. 具体操作: 1.进入MySQL控制台 &g ...

  7. [洛谷]p1996约瑟夫环 &xdoj1311

    https://www.luogu.org/problemnew/show/P1996 约瑟夫环这个问题一直以来都是用循环链表写的,今天才知道有循环队列的写法.以下是要点: 1.循环队列实现环的思想, ...

  8. python one

    哈哈,今天把它搞了 谁? Python啊! ..... *************************************** python:解释性语言,功能很强大,现在很有市场! & ...

  9. Cocos Creator scrollview添加事件的两种方法

    scrollview添加事件 方法一这种方法添加的事件回调和使用编辑器添加的事件回调是一样的,通过代码添加, 你需要首先构造一个 cc.Component.EventHandler 对象,然后设置好对 ...

  10. D Cloud of Hashtags Codeforces Round #401 (Div. 2)

    Cloud of Hashtags [题目链接]Cloud of Hashtags &题意: 给你一个n,之后给出n个串,这些串的总长度不超过5e5,你要删除最少的单词(并且只能是后缀),使得 ...