小龙最近做了一下下淘宝的店铺装修,里面封装的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. Oracle的表锁死以及解锁

    Oracle的表锁死以及解锁 oracle 查看锁死的表,锁死的进程. select sess.sid, sess.serial#, lo.oracle_username, lo.os_user_na ...

  2. 哪些问题是面试官经常问Java工程师的问题 ? --- 转自quora

    Which are the frequently asked interview questions for Java Engineers ? Vivek Vermani, www.buggybrea ...

  3. Wrong list

    1.背包dp[i][j]无论当前物品是否不大于j都可以转移dp[i-1][j] 2.循环从0开始还是1开始的问题 3.无向图边集数组开两倍 4.(3*987654321) > maxint 4. ...

  4. 【错误总结】java.lang.NoClassDefFoundError: org/objectweb/asm/ClassVisitor

    运行环境      JDK1.7 64位      Window 7  64位      Ecplise Java EE IDE      Struts 2.3.9      Tomcat 7 说明: ...

  5. SVN部署和使用

    一.SVN介绍 svn(subversion)是近年来崛起的版本管理工具,是cvs的接班人.目前,绝大多数开源软件都使用svn作为代码版本管理软件. 二.服务器端和客户端 1.服务器端软件Subver ...

  6. JavaScript中的 offset, client,scroll

    在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...

  7. Sicily 1151: 简单的马周游问题(DFS)

    这道题嘛,直接使用DFS搜索,然后莫名其妙地AC了.后来看了题解,说是move的顺序不同的话可能会导致超时,这时便需要剪枝,真是有趣.原来自己是误打误撞AC了,hhh.题解还有另一种解法是先把一条完整 ...

  8. 2016 Google code jam 答案

    二,RoundC import java.io.BufferedReader; import java.io.FileInputStream; import java.io.FileNotFoundE ...

  9. Winform自定义控件基础(二)

    protected override void WndProc(ref Message m)

  10. java性能调优及问题追踪--Btrace的使用

    在生产环境中经常遇到格式各样的问题,如OOM或者莫名其妙的进程死掉.一般情况下是通过修改程序,添加打印日志:然后重新发布程序来完成.然而,这不仅麻烦,而且带来很多不可控的因素.有没有一种方式,在不修改 ...