原文:bootstrap插件学习-bootstrap.alert.js

我们先看bootstrap.alert.js的结构 HTML结构 alert插件,比较简单。我们先从初始化开始 body去监听所有拥有data dismiss alert 属性的标签,并为它们绑定上Alert原型上的close方法,注意这里没有使用之前的 .proxy 方法,保持作用域,那我们进入这个方法后,方法内的this将指向触发事件的对象。 里面的执行步骤跟之前插件很相似,很多就不说了,这 ...

2013-08-26 09:16 2 6991 推荐指数:

查看详情

bootstrap插件学习-bootstrap.modal.js

先从bootstrap.modal.js的结构看起。 其HTML结构 我们开始过一遍插件源码:从初始化开始 根据HTML提供的结构,$target为a标签所指向的弹出框div的Jquery对象。另外$this.data()存在数据,为{toggle ...

Tue Aug 20 01:31:00 CST 2013 2 13935
bootstrap插件学习-bootstrap.dropdown.js

先看bootstrap.dropdown.js的结构 HTML结构 从初始化即时函数开始 这里需要注意事件的冒泡,一般我们点击页面上的一个按钮(或者一个可见的标签时)时,现在你点击的这个标签上先触发事件,如果你这个标签上有事件的话,触发完之后,它会 ...

Tue Aug 20 18:24:00 CST 2013 0 4873
bootstrap插件学习-bootstrap.tab.js

先看bootstrap-tab.js的结构 HTML结构 先从初始化开始 让body监听a标签的click事件,并且阻止其冒泡,调用了jQuery的原型方法tab。 这个结构跟之前的几个插件差不多,不过最后它是执行了show方法 ...

Thu Aug 22 17:02:00 CST 2013 7 8335
bootstrap插件学习-bootstrap.tooltip.js

先看bootstrap-tooltip.js的结构 因为tooltip插件的使用比较多,调用者比较杂,源码中没有给出初始化的步骤,在看源码的过程中,我们手动添加初始化。 在script标签部分加入以上代码,我们可以鼠标移入'卡梅隆'时显示提示框 ...

Fri Aug 23 17:06:00 CST 2013 5 9162
bootstrap插件学习-bootstrap.carousel.js

先看bootstrap.carousel.js的结构 HTML结构 先从初始化开始 根据HTML结构,为拥有data-slide属性的标签绑定click事件,如果我们点击向左按钮,代码会获取该标签的href,并获取整个控件的对象。接着让整个控件调用 ...

Wed Aug 28 17:06:00 CST 2013 5 6686
bootstrap插件学习-bootstrap.scrollspy.js

先看bootstrap.dropdown.js的结构 HTML结构 我们从初始化开始 根据HTML结构,这个很简单,获取body对象,并执行jQuery原型上的方法scrollspy,其中$spy.data()中的值,前几次的源码分析,这个值已经 ...

Wed Aug 21 17:11:00 CST 2013 1 3856
bootstrap插件学习-bootstrap.popover.js

先看bootstrap.popover.js的结构 个人感觉bootstrap.popover.jsbootstrap.tooltip.js的放大版。。源码处很多相似的地方,并且bootstrap.popover.js依赖与bootstrap.tooltip.js插件 ...

Sat Aug 24 23:45:00 CST 2013 2 6567
bootstrap插件学习-bootstrap.button.js

先看bootstrap.button.js的结构 HTML结构 这个例子有点问题,因为初始化时,第一个按钮没有绑定事件,所以第一个按钮不可用,不过没关系,读完源码之后,我们尝试将它补全。 像单独一个开关,直接本身就有btn类,像单选按钮,触发 ...

Sun Aug 25 20:50:00 CST 2013 0 3264
 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM