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

<div class="area001">触发区域</div>
<div class="J_TWidget hidden" data-widget-type="Popup" data-widget-config="{
'trigger':'.area001',
'align':{
'node':'.area001',
'offset':[0,0],
'points':['bl','tl']
}
}">
<div>弹出层</div>
</div>

这是一个简单的弹窗实例,弹层的参数简介如下:

data-widget-type为使用的挂件类型
data-widget-config为参数设置
其中trigger为触发对象
align为对齐方式
node为参考对齐目标
offset是微调
points[x,y]表示参考目标的x位置与弹窗层的y位置对齐,x和y有9个取值方式:【tl,tc,tr,cl,cc,cr,bl,bc,br】 (tl=top left)
时间有限,简单做了一下笔记,有时间了再来完善。

												

关于淘宝店铺装修弹出层popup的记录的更多相关文章

  1. jquerymobile知识点三:弹出层popup

    弹出层popup很简单,主要就是弹出验证,登陆注册,提交信息之类的,下面是我写好的一个demo... <div data-role="popup" id="popu ...

  2. 使用cookies弹出层每24小时弹出一次

    第一步:下载cookies的库 https://github.com/js-cookie/js-cookie 第二步:设置Cookies的失效时间,这里有两种方法,按天计算和按小时计算 functio ...

  3. Popup - 弹出层

    //图片类快捷弹出层 <a href="" target="_blank"> <div class="panlifang1" ...

  4. vant - 弹框 【Popup 弹出层】【DatetimePicker 时间选择】

    [HelloWorld.vue] <template> <div class="hello"> <van-row class="m-head ...

  5. JQuery weui 中的Popup (弹出层:底部)

    //弹出层(从底部) <div id="bottomb" class="weui-popup__container popup-bottom"> & ...

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

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

  7. Winform 实现像菜单一样弹出层

    原文:Winform 实现像菜单一样弹出层 在实际工作中,如果能像菜单一样弹出自定义内容,会方便很多,比如查询时,比如下拉列表显示多列信息时,比如在填写某个信息需要查看一些信息树时.这个时候自定义弹出 ...

  8. zepto弹出层组件

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

  9. jQuery弹出层始终垂直居中相对于屏幕或当前窗口

    把弹出层的位置设为fixed,设置top:50%,然后获取当前元素的整体的高度height,用获取的高度height/2,设置margin-top:-height/2.即可把当前的弹出层始终垂直居中于 ...

随机推荐

  1. Sql Server随机取数据

    select top 10 * from tablename order by NEWID()

  2. chrome谷歌浏览器插件制作简易教程

    1.在磁盘上创建一个目录,用来放应用的代码和资源 2.在这个目录中,创建一个文本文件,命名为manifest.json,其内容为: { "manifest_version": 2, ...

  3. 成功开发iPhone软件的10个步骤

    总结 几条要注意的原则: 1.了解你的用户,并与他们接触.交谈. 2.不要做虚幻的想象的设计,多从成功软件中汲取经验. 3.软件要设计得“小”. 4.找到足够多的设计方案,通过数量的累计来得到好的质量 ...

  4. codility flags solution

    How to solve this HARD issue 1. Problem: A non-empty zero-indexed array A consisting of N integers i ...

  5. java 单例模式

    懒汉式 public class Singleton{ //@单例类只能有一个实例 //@单例类必须自行创建这个实例 //@单例类必须给所有对象提供这一个实例//必须向整个系统提供这个这个实例 pri ...

  6. PYTHON 内置函数

    bin() #二进制 r = bin(11) print(r) # 0b1011 oct() #八进制 r = oct(14) print(r) #0o16 int() #十进制 r = int(10 ...

  7. ListView控件--2016年12月9日

    ListView属性 ListView   名称 说明 AccessKey 重写 WebControl.AccessKey 属性. 不支持将此属性设置 ListView 控件.(覆盖 WebContr ...

  8. ifram-locatione页面跳转

    在涉及银行页面时,需要跳转到银行页面var accound = document.getElemntById('accound');$.ajax({ dataType:'json', type:'po ...

  9. gen_server port 调用receive_match 问题

    问题由来 前些天对系统做了一个优化,将原来从queue 轮询刷出数据后每条消息一个 spawn 进程单独处理,修改为批量刷出.一条一条刷轮询刷 queue 存在问题:刷queue 进程太多时,占用CP ...

  10. java大并发数据保存方案

    做了几年.net,如今终于要做java了. 需求: 线下终端会定时上传gps位置到服务端,服务端收到数据保存到mysql数据库,当线下终端过多时,问题出现了,首当其冲的是数据库连接池经常会崩溃,单个t ...