附加导航(Affix)插件允许指定 <div> 固定在页面的某个位置。一个常见的例子是社交图标。它们将在某个位置开始,但当页面点击某个标记,该 <div> 会锁定在某个位置,不会随着页面其他部分一起滚动。

如果您想要单独引用该插件的功能,那么您需要引用 affix.js。或者,正如 Bootstrap 插件概览 一章中所提到,您可以引用 bootstrap.js或压缩版的 bootstrap.min.js

用法

您可以通过 data 属性或者通过 JavaScript 来使用附加导航(Affix)插件。

  • 通过 data 属性:如需向元素添加附加导航(Affix)行为,只需要向需要监听的元素添加 data-spy="affix" 即可。请使用偏移来定义何时切换元素的锁定和移动。

Bootstrap 附加导航(Affix)插件的更多相关文章

  1. Bootstrap 附加导航(Affix)插件

    bootstrap 附加导航(Affix)插件允许某个div元素固定到页面中的某个位置.您可以打开或关闭使用该插件之间进行切换 后续再写

  2. 第二百四十九节,Bootstrap附加导航插件

    第二百四十九节,Bootstrap附加导航插件 学习要点: 1.附加导航插件 本节课我们主要学习一下 Bootstrap 中的附加导航插件 一.附加导航 注意:此插件要使用 bootstrap3.0. ...

  3. 使用附加导航(affix)实现内容切换

    <!DOCTYPE html> <html> <head> <title> new document </title> <meta c ...

  4. bootstrap的 附加导航Affix导航 (侧边窄条式 滚动监控式导航) 附加导航使用3.

    affix: 意思是粘附, 附着, 沾上. 因此, 附加导航就是 bootstrap的 Affix.js组件. bootstrap的 附加导航, 不是说导航分成主导航, 或者什么 副导航的 而是指, ...

  5. Bootstrap中的Affix插件

    我们为什么要用bootstrap?因为懒!哦....不,是因为方便,呃...意思差不多. 今天来说说Affix这个插件,它可以使导航栏固定,免去了自己手写的麻烦,用着非常方便,废话不多说,下面是用法. ...

  6. 解决Bootstrap 附加导航(Affix)的问题和使用时若干注意事项

    1.要清楚Affix分别赋予的class, 开始:affix-top 达到top参数:affix 达到bottom参数:affix-bottom 2.一定要自定义这些class,否则 插件会默认给你在 ...

  7. Bootstrap Affix(附加导航(Affix)插件的用法)

    原文网址:http://www.runoob.com/bootstrap/bootstrap-affix-plugin.html Bootstrap 附加导航(Affix)插件 附加导航(Affix) ...

  8. Bootstrap-Plugin:附加导航(Affix)插件

    ylbtech-Bootstrap-Plugin:附加导航(Affix)插件 1.返回顶部 1. Bootstrap 附加导航(Affix)插件 附加导航(Affix)插件允许某个 <div&g ...

  9. Bootstrap 学习笔记13 附加导航插件

    附加导航代码: <style> a:focus { outline: none; } .nav-pills { width: 150px; } .nav-pills.affix { top ...

随机推荐

  1. 移动APP和传统软件测试的区别[转载]

    目录 1. 移动App比PC 上的程序测试要复杂 2. 移动APP测试中如何设计Test Case 3. 让自己成为真实的用户 4. 关注用户体验测试 5. 少做UI自动化,多做后台接口的自动化 6. ...

  2. SpringMVC前后端参数交互

    Controller中使用JSON方式有多种 关键在于ajax请求是将数据以什么形式传递到后台 HTTP请求中: 如果是get请求,那么表单参数以name=value&name1=value1 ...

  3. ttytype - 终端设备映射的默认终端类型

    DESCRIPTION(描述) /etc/ttytype 文件把termcap/terminfo中的终端类型名与tty行关联起来.每行包括一种终端类型,后面跟着空格,然后是tty名(不带 /dev/ ...

  4. windows 远程登录

    在我的电脑  属性当中开启远程登录功能 然后制作账号,这里对于账号的命名是有要求的,具体网上查找说是要用户名和全名一样,我没有做测试,不过新创建了一个用户用来登录,总是告知我密码错误,导致登录失败,所 ...

  5. VBA+SQL transform pivot union联合查询的基础应用

    Sub 项目状态查询() '如果“项目状态”是未转运营那么实施状态是不能选择的,因为还没有实施.'如果“项目状态”选择状态后,那么项目名称里面只显示该状态的项目名称.如果“项目状态”选择的不是未转运营 ...

  6. vue组件基础之创建与使用

    一.创建组件 <script src="vue.js"></script> <!--引入vue.js文件--> <div id=" ...

  7. GitHub不能访问问题

    在C:\Windows\System32\drivers\etc文件夹下HOSTS里面最后添加: 192.30.253.112 github.com 192.30.253.113 github.com ...

  8. yum 安装pip

    centos7 没有python-pip包就执行命令 yum -y install epel-release 执行成功之后,再次执行yum install python-pip 对安装好的pip进行升 ...

  9. C#中反射的基础基础基础

    class Program { static void Main(string[] args) { Type t = typeof(Student);//typeof(类) 取类的类型 并且存储在Ty ...

  10. 利用reduce方法,对数组中的json对象去重

    数组中的json对象去重 var arr = [{ "name": "ZYTX", "age": "Y13xG_4wQnOWK1Q ...