-
1. data-toggle="tab" 2.id 与href 匹配查看全部
-
<li class="active"><a href="#bulletin" role="tab" data-toggle="tab">公告</a></li> </ul> <!-- 选项卡面板 --> <div id="bulletin" class=""> href对应的是下面的id查看全部
-
data-interval="5000" 自动播放 隔5s data-pause="hover" 悬浮停止轮播查看全部
-
轮播图基本结构 <div class="carousel"data-ride="carousel" id="showcar"> <ol class="carousel-indicators"> <li class="active" data-slide-to="0" data-target="#showcar"><a href="#">1</a></li> <li>2</li> <li>3</li> <li>4</li> </ol> <div class="carousel-inner"> <div class="item active"> <img src=""alt=""> <div class="carousel-caption"> <h4></h4> <p></p> </div> </div> </div> <a href="#showcar" class="carousel-control" data-slide="prev"> <span class="glyphicon glyphicon-left"> </a> </div>查看全部
-
按钮插件--模拟复选按钮 <div class="btn-group" data-toggle="buttons"> <label class="btn btn-info"> <input type="checkbox" >摄影查看全部
-
按钮插件--按钮加载状态 $("#id").click(function(){ $(this).button("load"); })查看全部
-
警告框（Alert） <div class="alert alert-success"> <button type="button" class="close" data-dismiss="alert">×</button> <p>其实我根本不能说，其实我没你不能活</p> </div>查看全部
-
提示框--其他的自定义属性 点击才出现 在<button>里面加上<data-triggle="click">查看全部
-
提示框JS: $('[data-toggle="tooltip"]'.tooltip(); $("#mytooltip").tooltip({ placement:'top', title:"我在上方" })查看全部
-
提示框--结构(要配合自己写的js一起用,不能用bs库里面的 <button class="btn btn-info data-toggle="tooltip" data-placement="right" data-origin-title="我在右边" >我在右边</button>查看全部
-
提示框(Tooltip) <button type="button" class="btn btn-success" data-toggle="tooltip" data-placement="left" data-original-title="内容">内容</button>查看全部
-
选项卡--选项卡的结构 一个选项卡主要包括两个部分，其一是菜单项，其二是内容面板。 <ul id="myTab" class="nav nav-tabs" role="tablist"> <li class="active"><a href="#bulletin" role="tab">公告</a></li> <li><a href="#rule" role="tab">规则</a></li> <li><a href="#forum" role="tab">论坛</a></li> <li><a href="#security" role="tab">安全</a></li> <li><a href="#welfare" role="tab">公益</a></li> </ul> <!-- 选项卡面板 --> <div id="myTabContent" class="tab-content"> <div class="tab-pane fade in active" id="bulletin">公告内容面板</div> <div class="tab-pane fade" id="rule">规则内容面板</div> <div class="tab-pane fade" id="forum">论坛内容面板</div> <div class="tab-pane fade" id="security">安全内容面板</div> <div class="tab-pane fade" id="welfare">公益内容面板</div> </div>查看全部
-
<div data-spy="scroll" data-target="#selector" data-offset="0" > <h4 id="home">Home</h4><p>查看全部
-
$(function(){ //当下拉菜单隐藏时，调用dropdown(“toggle”)方法可以显示下拉菜单，反之，如果下拉菜单显示时，调用dropdown(“toggle”)方法可以让下拉菜单隐藏。 //$('.dropdown-toggle').dropdown(); // 下拉框加载上来时就显示 // $('.dropdown-toggle').dropdown('toggle'); // 建议使用这种 $(".dropdown-toggle").one("click",function(){ $(this).dropdown("toggle"); }) });查看全部
-
实现下拉菜单原理： Dropdown插件加载时，对所有带 有“data-toggle=dropdown”样式的元素绑定了事件，用户单击带有“data-toggle=dropdown”样式的链接或按钮时， 会触发JavaScript事件代码。当用户点击带有“data-toggle=dropdown”样式的链接或按钮时，下拉菜单的父容器（上面的示例是 “<li class="dropdown">”）会添加一个open类名，此时下拉菜单显示；再次单击时，JavaScript会删除刚添加的open类 名，此时下拉菜单将隐藏。查看全部
举报
0/150
提交
取消