-
bootstrap中的“模态弹出框”有以下几个特点： 1、模态弹出窗是固定在浏览器中的。 2、单击右侧全屏按钮，在全屏状态下，模态弹出窗宽度是自适应的，而且modal-dialog水平居中。 3、当浏览器视窗大于768px时，模态弹出窗的宽度为600px。查看全部
-
Bootstrap的JavaScript插件可以单独导入到页面中，也可以一次性导入到页面中。因为在Bootstrap中的JavaScript插件都是依赖于jQuery库，所以不论是单独导入还一次性导入之前必须先导入jQuery库。 一次性导入： Bootstrap提供了一个单一的文件，这个文件包含了Bootstrap的所有JavaScript插件，即bootstrap.js（压缩版本：bootstrap.min.js）。 <!—导入jQuery版本库，因为Bootstrap的JavaScript插件依赖于jQuery --> <script src="http://libs.baidu.com/jquery/1.9.0/jquery.js"></script> <!—- 一次性导入所有Bootstrap的JavaScript插件（压缩版本） --> <script src="js/bootstrap.min.js"></script> 特别声明：jQuery版本库也可以加载你本地的jQuery版本。 单独导入： 为方便单独导入特效文件，Bootstrap V3.2中提供了12种JavaScript插件，他们分别是： 动画过渡（Transitions）:对应的插件文件“transition.js” 模态弹窗（Modal）:对应的插件文件“modal.js” 下拉菜单（Dropdown）：对应的插件文件“dropdown.js” 滚动侦测（Scrollspy）：对应的插件文件“scrollspy.js” 选项卡（Tab）：对应的插件文件“tab.js” 提示框（Tooltips）：对应的插件文件“tooltop.js” 弹出框（Popover）：对应的插件文件“popover.js” 警告框（Alert）：对应的插件文件“alert.js” 按钮（Buttons）：对应的插件文件“button.js” 折叠/手风琴（Collapse）：对应的插件文件“collapse.js” 图片轮播Carousel：对应的插件文件“carousel.js” 自动定位浮标Affix：对应的插件文件“affix.js” 上述单独插件的下载可到github去下载（https://github.com/twbs/bootstrap）。查看全部
-
data-target="#navbar-menu" data-spy="scroll"和$(function(){$("#scrollspy").scrollspy({target:"#navbar-menu"});})查看全部
-
模拟 radio查看全部
-
div.carousel slide data-ride="carousel"实现图片轮播 ol>li data-target=".carousel",data-slide-to="n" 实现轮播计数器效果 a href=".carousel" data-slide="prev|next"实现点击下一张或上一张图片效果查看全部
-
一、data-parent="#ID"设置后可以实现点击某一元素可以关闭其他所有折叠区 二、<button>元素作为触发器必须使用data-target查看全部
-
若定义了data-dismiss="alert"，先查找data-target和href若两个都不存在则关闭父元素查看全部
-
插件源文件：scrollspy.js （官方发布引用地址：http://cdn.bootcss.com/bootstrap/2.3.1/js/bootstrap-scrollspy.js） 滚动监控器是Bootstrap提供的非常实用的JavaScript插件，被广泛应用到Web开发中。其表现形式是： 1、当用户鼠标滚动时，滚动条的位置会自动更新导航条中相应的导航项。 2、用户拖动滚动条，当滚动到@mdo时，上面的@mdo导航项就会高亮显示。 这是因为该插件可以自动检测滚动条到达哪个位置，然后在需要高亮的菜单元素上加了一个“active”样式。查看全部
-
这章有bug，chrome点击不能隐藏查看全部
-
Bootstrap(JS插件） 下拉菜单--属性声明式方法 属性声明式方法： 一般下拉菜单都是出现在导航条中，比如下图的一个效果，用户点击带有三角形的菜单项都会弹出下拉菜单项：<div class="navbar navbar-default" id="navmenu"> <a href="##" class="navbar-brand">W3cplus</a> <ul class="nav navbar-nav"> <li class="dropdown"> <a href="##" data-toggle="dropdown" class="dropdown-toggle" role="button" id="tutorial">教程<b class="caret"></b></a> <ul class="dropdown-menu" role="menu" aria-labelledby="tutorial"> <li role="presentation"><a href="##">CSS3</a></li> <li role="presentation"><a href="##">HTML5</a></li> <li role="presentation"><a href="##">Sass</a></li> </ul> </li> <li><a href="##">前端论坛</a></li> <li><a href="##">关于我们</a></li> </ul> </div>查看全部
-
模态弹出框--触发模态弹出窗2种方法 A 声明式触发方法： 方法一：模态弹出窗声明，只需要自定义两个必要的属性：data-toggle和data-target（bootstrap中声明式触发方法一般依赖于这些自定义的data-xxx 属性。比如data-toggle="" 或者 data-dismiss=""）。例如： <!-- 触发模态弹出窗的元素 --> <button type="button" data-toggle="modal" data-target="#mymodal" class="btn btn-primary">点击我会弹出模态弹出窗</button> <!-- 模态弹出窗 --> <div class="modal fade" id="mymodal"> <div class="modal-dialog"> <div class="modal-content"> <!-- 模态弹出窗内容 --> </div> </div> </div> 注意以下事项： 1、data-toggle必须设置为modal(toggle中文翻译过来就是触发器)； 2、data-target可以设置为CSS的选择符，也可以设置为模态弹出窗的ID值，一般情况设置为模态弹出窗的ID值，因为ID值是唯一的值。 方法二：触发模态弹出窗也可以是一个链接<a>元素，那么可以使用链接元素自带的href属性替代data-target属性，如： <!-- 触发模态弹出窗的元素 --> <a data-toggle="modal" href="#mymodal" class=" btn btn-primary" >点击我会弹出模态弹出窗</a> <!-- 模态弹出窗 --> <div class="modal fade" id="mymodal" > <div class="modal-dialog" > <div class="modal-content" > <!-- 模态弹出窗内容 --> </div> </div> </div> 不过建议还是使用统一使用data-target的方式来触发。查看全部
-
JS控制轮播查看全部
-
Bootstrap实现轮播图查看全部
-
选项卡 关键一点，选项卡中链接的锚点要与对应的面板内容容器的ID相匹配。查看全部
-
<div class="panel-group" id="accordion">下面的子元素data-parent="#accordion"也应该是对应的id，不然的话，如果展开了一个面板，再点击第二个的时候第一个不会收上去查看全部
举报
0/150
提交
取消