滚动监听

       滚动监听有两种方式:
       (1)通过属性控制

       向想要滚动监听的元素添加如下属性data-spy="scroll",然后添加data-target属性,该属性可以是导航栏的ID或者是导航栏的class
       (2)通过脚本控制:
       $("滚动监听的元素").scrollspy({target:'导航栏的ID或者Class'})
       可以使用.refresh更新dom元素
       使用方法:$("被更新元素").scrollspy('refresh');
       滚动监听时可以添加被激活时执行的事件
      使用方法:$("被监听项目").on("active.bs.scrollspy",function(){执行的代码})
       补充:如果想实现锚点平滑跳转,可以增加以下代码:
<script type="text/javascript">
        $("a").click(function () {
            var href = $(this).attr("href");
            var pos = $(href).offset().top;
            $("html,body").animate({ scrollTop: pos }, 500);
            return false;
        });
    </script>
        

bootstrap学习笔记(6)的更多相关文章

  1. Bootstrap~学习笔记索引

    回到占占推荐博客索引 bootstrap已经用了有段时间了,感觉在使用上还是比较容易接受的,在开发人员用起来上,也还好,不用考虑它的兼容性,手机,平台,PC都可以有效的兼容. bootstrap官方a ...

  2. Bootstrap学习笔记(二) 表单

    在Bootstrap学习笔记(一) 排版的基础上继续学习Bootstrap的表单,编辑器及head内代码不变. 3-1 基础表单 单中常见的元素主要包括:文本输入框.下拉选择框.单选按钮.复选按钮.文 ...

  3. bootstrap学习笔记之为导航条添加标题、二级菜单及状态 http://www.imooc.com/code/3120

    为导航条添加标题.二级菜单及状态 加入导航条标题 在Web页面制作中,常常在菜单前面都会有一个标题(文字字号比其它文字稍大一些),其实在Bootstrap框架也为大家做了这方面考虑,其通过" ...

  4. bootstrap学习笔记之基础导航条 http://www.imooc.com/code/3111

    基础导航条 在Bootstrap框中,导航条和导航从外观上差别不是太多,但在实际使用中导航条要比导航复杂得多.我们先来看导航条中最基础的一个--基础导航条. 使用方法: 在制作一个基础导航条时,主要分 ...

  5. Bootstrap学习笔记-布局

    Bootstrap学习笔记-布局 默认是响应式布局,就是你在改变页面的时候也不会出现乱的现象. <html><head> <meta charset="utf- ...

  6. Bootstrap学习笔记博客

    本片博客用于记录之后要用到Bootstrap的学习笔记   概括: Bootstrap 是一个用于快速开发 Web 应用程序和网站的前端框架.Bootstrap 是基于 HTML.CSS.JAVASC ...

  7. bootstrap学习笔记--bootstrap安装环境

    Bootstrap 安装是非常容易的.此文是本人的学习汇总,便于以后查询学习,同时也希望给大家带来帮助. 下载 Bootstrap 您可以从 http://getbootstrap.com/ 上下载 ...

  8. Bootstrap学习笔记系列1-------Bootstrap网格系统

    Bootstrap网格系统 学习笔记 [TOC] 简单网格 先上代码再解释 <!DOCTYPE html> <html> <head> <title>B ...

  9. bootstrap 学习笔记(1)---介绍bootstrap和栅格系统

    学习前端许久,对于布置框架和响应浏览器用html 和javascript 写的有点繁琐,无意间看到这个框架,觉得挺好用的就开始学习了,但是这个框架上面有很多知识,不是所有的都要学的,故将学习笔记和觉得 ...

  10. bootstrap 学习笔记

    bootstrap作为当下的流行框架不知道它怎么能行呢? 之前也看过好多bootstrap的网上教程,可是发现光看真的记不住,说起来也真是忧桑~重点还是要自己做才是真正的印象深刻.后来我发现解析模板是 ...

随机推荐

  1. SQLServer2008新建链接服务器for Oracle

    SQLServer2008新建链接服务器for Oracle   最近要在SQLServer2008中使用Oracle 10g的一个视图,通过建立链接服务器即可在SQLServer中使用Oracle提 ...

  2. Photoshop操作指南

    缩放工具(Z) 之后涉及到移动功能,暂时切换到小抓手工具. 图1 图2 切换到:暂时切换到:当按住空格键的时候,显示小抓手工具.松开之后,又回到了之前的显示上. 满画布显示当前画面:ctrl+0(数字 ...

  3. (笔记)Linux内核学习(五)之中断推后处理机制

    一 中断 硬件通过中断与操作系统进行通信,通过对硬件驱动程序处注册中断处理程序,快速响应硬件的中断. 硬件中断优先级很高,打断当前正在执行的程序.有两种情况: 硬件中断在中断处理程序中处理 硬件中断延 ...

  4. c++中两个类互相引用的问题

    最近在改一个C++程序的时候碰到一条警告信息,警告信息为:“ 删除指向不完整“Q2DTorusNode”类型的指针:没有调用析构函数                1> c:\users\lxw ...

  5. 单线程vs多线程

    a.多线程可以说是实现异步的一种方式: b.共同点:多线程和异步操作两者都可以达到避免调用线程阻塞的目的,从而提高软件的可响应性: c.线程消费CPU资源.  异步消费硬件资源: 1.多线程和异步操作 ...

  6. 精选29款非常实用的jQuery应用插件

    今天我们来分享一些实用的jQuery应用插件,没有特别花哨,但都比较实用,jQuery菜单.jQuery图片都有涉及到,一起来看看. 1.jQuery+CSS3仿IOS无线局域网Wifi DEMO演示 ...

  7. 学习使用:before和:after伪元素

    如果你一直密切关注着各种网页设计的博客,你可能已经注意到了:before和:after伪元素已经在前端开发中获得了相当多的关注.特别是在Nicolas Gallagher的博客中,后期运用了很多伪类元 ...

  8. Linux中vi显示中文乱码的问题

    由于在windows下默认是gb编码,而我的vim默认是utf-8(gedit默认也是utf-8),所以打开会成乱码.修改了一下配置文件,使vi支持gb编码就好了.$vi ~/.vimrclet &a ...

  9. 译:在ASP.NET中如何对cookies进行加密和解密

    译文地址:http://www.codeproject.com/Tips/872826/Encrypt-Decrypt-Cookies-in-ASP-NET 源代码:http://files.cnbl ...

  10. linux_脚本应用

    linux下三个有用的 Python 脚本 2010年4月29日   import os, sys  def pyc_clean(dir):      findcmd = 'find %s -name ...