06 2016 档案

bootstrap源码分析之Carousel
摘要：源码文件： Carousel.scssCarousel.js 实现原理： 隐藏所有要显示的元素，然后指定当前要显示的为block，宽、高自适应 源码分析： 1、Html结构：主要分为以四个部分 1.1、容器：最外层div，需要一个data-ride=”carousel”来指定为轮播放插件，并且提供一个Id，方便圆圈指示符的关联 1.2、图片列表部分，用一个外层div包裹所有，然后每个img会被... 阅读全文
posted @ 2016-06-12 21:47 小龙女先生 阅读(1057) 评论(0) 推荐(0) 编辑
BOOtstrap源码分析之 tooltip、popover
摘要：一、tooltip（提示框） 源码文件： Tooltip.jsTooltip.scss 实现原理： 1、获取当前要显示tooltip的元素的定位信息（top、left、bottom、right、width、height等）2、计算tooltip的位置，是top、left、bottom、right其中一个3、然后根据计算的位置值，运算出坐标值4、给tooltip应用坐标值 源码分析： 1、owner... 阅读全文
posted @ 2016-06-12 21:35 小龙女先生 阅读(2466) 评论(0) 推荐(0) 编辑
bootstrap源码分析之tab（选项卡）
摘要：实现tab选项卡的应用，此插件相对比较简单 源码文件： tab.js 实现原理 1、单击一个元素时，首先将原来高亮的元素取消2、然后给被单击元素进行高亮3、如果单击元素是下拉框中某个选项，则选中本身，还要选中下拉框5、如果定义了动画，先执行动画，然后回调 源码分析： 1、Show方法，是在单击一个元素的时候触发，会触发如下四个事件 1.1、Hiden.bs.tab：隐藏上一个元素 1.2、Sh... 阅读全文
posted @ 2016-06-05 21:04 小龙女先生 阅读(835) 评论(0) 推荐(0) 编辑
bootstrap源码分析之scrollspy（滚动侦听）
摘要：源码文件： Scrollspy.js 实现功能 1、当滚动区域内设置的hashkey距离顶点到有效位置时，就关联设置其导航上的指定项2、导航必须是 .nav > li > a 结构，并且a上href或data-target要绑定hashkey3、菜单上必须有.nav样式4、滚动区域的data-target与导航父级Id（一定是父级）要一致 one tw... 阅读全文
posted @ 2016-06-05 20:57 小龙女先生 阅读(797) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示