玩转Bootstrap（JS插件篇）_学习笔记

首页免费课玩转Bootstrap（JS插件篇）笔记

玩转Bootstrap（JS插件篇）

                
                大漠
            Web前端工程师

                    查看讲师更多课程 
                    大漠讲师的其他课程
                
Sass进阶篇
中级·46634
免费课程
                                
Sass入门篇
中级·104424
免费课程
                                
玩转Bootstrap（基础）
初级·314544
免费课程
                                
十天精通CSS3
初级·242643
免费课程
                                
                难度中级
            
                时长 6小时25分
            
                学习人数
            
综合评分9.17
                            138人评价
                        查看评价
                                9.5
                                内容实用
                            
                                9.0
                                简洁易懂
                            
                                9.0
                                逻辑清晰

最热最新

XieGuoqing

<div class="alert alert-danger"> <button class="close" data-dismiss="alert" type="button">×</button> </div>

查看全部

0 采集收起来源：警告框--结构与样式
2018-03-22
qq_keepcalmandc_0

body要申明滚动监控

查看全部

0 采集收起来源：固定定位--声明式触发固定定位
2015-10-18
qq_keepcalmandc_0

图片轮播 data设置代码

查看全部

0 采集收起来源：图片轮播--声明式触轮播图的播放（二）
2015-10-18
qq_keepcalmandc_0

图片轮播实例代码

查看全部

0 采集收起来源：图片轮播--JavaScript触发方法
2015-10-18
qq_依旧_juwDY1

$(function(){ $(".btn").click(function(){ $("#mymodal").modal("toggle"); }); $("#mymodal").on('show.bs.modal',function(){ alert('模态框即将显示！！！'); }); $("#mymodal").on('shown.bs.modal',function(){ alert('模态框已经显示！！！'); }); $("#mymodal").on('hide.bs.modal',function(){ alert('模态框即将关闭！！！'); }); $("#mymodal").on('hidden.bs.modal',function(){ alert('模态框已关闭！！！'); }); });

查看全部

0 采集收起来源：模态弹出框--JavaScript触发时的参数设置（二）
2018-03-22
守望孤独

模态框功能实现：在触发元素上添加属性：data-togggle="modal" data-target="#id" (id是模态框最外层元素的id) 在实现关闭功能的元素上添加属性：data-dismiss="model"

查看全部

0 采集收起来源：模态弹出框--实现原理解析（一）
2018-03-22
守望孤独

模态框结构：model model-dialog model-content model-header model-title model-body model-footer

查看全部

0 采集收起来源：模态弹出框--实现原理解析（一）
2015-10-03
Beancurd

data-参数 backdrop keyboard

查看全部

0 采集收起来源：模态弹出框--模态弹出窗的使用（data-参数说明）
2015-10-02
chy_zsy

之前的同学代码都是瞎写完全不看内容。。有问题也是醉了。 scrollspy.js锚点插件

查看全部

0 采集收起来源：滚动监控器--滚动监控器的设计
2015-09-24
Ttvi

http://9iphp.com/web/html/1034.html

查看全部

0 采集收起来源：固定定位--声明式触发固定定位
2015-09-15
矮子高

按钮Buttons ____loading ________btn[data-loading-text=XXX] ________触发$().click(fun(){$(this).button("loading")}) ____模拟单选择按钮 ________div.btn-group[data-toggle=buttons]>lable.btn>input[type=radio]*$$ ____模拟复选按钮 ________input[type=checkbox] ____按钮状态切换 ________三次点击效果不同 ________btn[data-toggle=button] ____$("btn").click(fun(){$(this).button('loading').delay(1000)}) 折叠/手风琴Collapse ____.panel-group ________.panel*$$ ____________.panel-heading ________________.panel-title>a[data-toggle=collapse][data-parent=#XXX][href=#one] ____________#one.panel-collapse.collapse.in ________________.panel-body 图片轮播Carousel ____#slidershow(可选).carousel ________ol.carousel-indicators ____________li.active ____________li ________.carousel-inner ____________.item[.active]] ________________[a>]imgcontrol ________________.carousel-caption ____轮播控制器 ________声明式 ____________a.left.carousel-control____ 自动定位浮标Affix ____.[data-spy:affix][data-offset[-top-bottom]=xxpx] 动画过渡Transitions

查看全部

0 采集收起来源：在线自定义设置--Bootstrap组件
2018-03-22
矮子高

下拉菜单Dropdown ____.nav ____.navbar 滚动侦测Scrollspy ____鼠标滚动时，滚动条的位置会更新相应的导航项 ____#navbar-menu.navbar.navbar-default>..>a[href=#XXX]*$$ ____.scrollsy(/其他)[data-target="#navbar-menu"][data-spy=scroll][data-offset=60>xx#XXX ____css .scrollsy{h:XXX;of:a} ____导航栏固定navbar-fixed-top 选项卡Tab ____结构 ________ul.nav-tabs>li>a[href=#XX][data-toggle=tab] ________div.tabcontent>div#XX.tab-pane*$ ____________可选 .fade ____nav-pills ________data-toggle=pill 提示框Tooltips ____a/button[data-toggle=tooltip][data-placement="left"][data-original-title=XXX] ____不能直接触发 ________js $('#XXX').tooltip() ________js $('#XXX').tooltip({title=XX,spacement=XXX}) 弹出框Popover ____a/btn[data-container=body][data-placement=XXX][data-toggle=popover][data-original-title=...][data-content] ____js $(XXX).popover() 警告框Alert ____div.alert>button.close{×} ____触发 ________data-dismiss="alert" ________js $().click(fn(){$(this).alert("close")})

查看全部

0 采集收起来源：在线自定义设置--Bootstrap组件
2018-03-22
庚庚

提示框 tooltip 的默认触发事件是 hover 和 focus，而弹出框 popover 是 click 提示框 tooltip 只有一个内容(title)，而弹出框不仅可以设置标题（title）还可以设置内容(content)

查看全部

0 采集收起来源：弹出框--提示框和弹出框的异同
2015-09-15
庚庚

button就是default a就是primary

查看全部

0 采集收起来源：提示框(Tooltip)
2015-09-15
庚庚

<button data-target=".bs-example-js-navbar-scrollspy" data-toggle="collapse" type="button" class="navbar-toggle collapsed"> <span class="sr-only">Toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span> </button> 这一部分是响应式布局

查看全部

0 采集收起来源：滚动监控器--声明属性触发滚动监控
2018-03-22