为了账号安全,请及时绑定邮箱和手机立即绑定

玩转Bootstrap(JS插件篇)

Bootstrap 4:
show:默认显示
Bootstrap 4:
<nav id="ID1" class="navbar navbar-expand-* fixed-top">
<ul class="navbar-nav">
<li class="nav-item dropdown">
<a href="#" class="nav-link dropdown-toggle" data-toggle="dropdown">...</a>
<div class="dropdown-menu">
<a href="#ID2" class="dropdown-item">...</a>
</div>
</li>
</ul>
</nav>
Bootstrap 4:
<a href="#ID" class="carousel-control-prev" data-slide="prev">
<span class="carousel-control-prev-icon"></span>
</a>
<a href="#ID" class="carousel-control-next" data-slide="next">
<span class="carousel-control-next-icon"></span>
</a>
Bootstrap 4:
<div class="carousel-inner">
<div class="carousel-item active">
<img src="..." />
<div class="carousel-caption">...</div>
</div>
<div class="carousel-item">
<img src="..." />
<div class="carousel-caption">...</div>
</div>
</div>
Bootstrap 4:
show:默认显示
Bootstrap 4:
<div id="ID1" class="accordion">
<div class="card">
<div class="card-header">
<a href="#ID2" class="card-link" data-toggle="collapse">...</a>
</div>
<div id="ID2" class="collapse" data-parent="#ID1">
<div class="card-body">...</div>
</div>
</div>
</div>
Bootstrap 4:
<div class="btn-group btn-group-toggle" data-toggle="buttons">
<label class="btn">
<input type="radio或checkbox" />

</label>
<label class="btn">
<input type="radio或checkbox" />

</label>
</div>
$("#mybutton").click(function(){
$(this).button("loading").delay(1000).queue(function(){
$(this).button("toggle").button("reset").dequeue();
});
});
Bootstrap 4:
<div class="alert alert-dismissible">
<button class="close" data-dismiss="alert">&times;</button>
</div>
Bootstrap 4:
<div class="alert alert-dismissible">
<button class="close" data-dismiss="alert">&times;</button>
</div>
Bootstrap 4:
<div class="dropdown">
<button class="dropdown-toggle btn" data-toggle="dropdown">...</button>
<div class="dropdown-menu">
<a href="..." class="dropdown-item">...</a>
<a href="..." class="dropdown-item">...</a>
</div>
</div>
是的颠三倒四多所
&lt;script src=&quot;http://cdn.bootcss.com/bootstrap/3.3.1/js/bootstrap-popover.js&quot;&gt;&lt;/script&gt;
引入代码
该课的例子是错误的,不管有没有toggle都会连触发而不会隐藏,主要是元素选择的不对:应该选择里面的要显示的ul元素,同时失去主焦点时,隐藏此ul元素

$(function(){
$(&#039;#course&#039;).on(&#039;click&#039;,function(){
$(&#039;#course-menu&#039;).toggle();
}).focusout(function(){
$(&#039;#course-menu&#039;).hide();
});
});
监控器监控的内容,一定要处于scrollspy状态.
这里还有一个要匹配的问题,即监控的内容要处于scrollspy状态.
比如你要监控的是body, 那body一定处于scrollspy状态.
如果你要监控的一个div,那div一定要处于scrollspy状态.
不然的话监控是没有效果的.
比如:
你监控div,但是div的内容不处于scrollspy, 这时body处于scrollspy是没有用的.
首页上一页1234567下一页尾页
课程须知
本课程适合具有一定前端基础的人员,对HTML和CSS有一定的了解,对于定制Bootstrap的同学需要具备LESS和Sass基础知识。
老师告诉你能学到什么?
1、使用JS自由控制Bootstrap中提供的组件。

微信扫码,参与3人拼团

意见反馈 帮助中心 APP下载
官方微信
友情提示:

您好,此课程属于迁移课程,您已购买该课程,无需重复购买,感谢您对慕课网的支持!

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?

举报

0/150
提交
取消