滚动监听

       滚动监听有两种方式:
       (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. iSAC测试报告

    iSAC测试报告 测试码流:24k bit/s 测试环境:三星i9250  CPU 1.2G*2   ram:1G  TI芯片  OMAP 4460 双核1.2GHz MOTO ME722  CPU ...

  2. [原] JsTree.js

    写自用软件系统时查找到的树列表控件过于庸余,样式难调,故自写一套完整的简易js_TreeTable控件,使用时简单的添加自定义的样式效果即可,特此发布第一个版本. 源码如下: /* * Huashan ...

  3. 20+功能强大的jQuery/CSS3图片特效插件

    以下是分享的20几个不错的图片特效插件,基于jQuery和CSS3. 1.jQuery图片下滑切换播放效果 这是一款基于jQuery的焦点图插件,这款焦点图的特点是有向下滑动的动画效果,滑到底部时,有 ...

  4. JS/React 判断对象是否为空对象

    JS一般判断对象是否为空,我们可以采用: if(!x)的方式直接判断,但是如果是一个空对象,比如空的JSON对象,是这样的:{},简单的判断是不成功的,因为它已经占用着内存了,如果是JQuery的话, ...

  5. Solution to “VirtualBox can't operate in VMX root mode” error in Windows 7

    I was trying out various virtualization solutions on Windows 7, including Microsoft Virtual PC and V ...

  6. ubuntu14.04 LTS 更新源

    官方源: deb http://archive.ubuntu.com/ubuntu/ trusty main restricted universe multiverse deb http://arc ...

  7. 重新发现梯度下降法--backtracking line search

    一直以为梯度下降很简单的,结果最近发现我写的一个梯度下降特别慢,后来终于找到原因:step size的选择很关键,有一种叫backtracking line search的梯度下降法就非常高效,该算法 ...

  8. WCF学习日记

    图书馆借阅了<WCF高级编程>,从6.11开始学习wcf,希望尽快熟悉原理和编程模型以及常用编程方法.     WCF是一个平台,也是一个框架,从Net.3.0 就在Net framewo ...

  9. sudo: /etc/sudoers is mode 0777, should be 0440终极解决之道

    不得不说,有时候手贱的把/etc/sudoers文件权限改了,是一件很蛋疼的事.因为此时你会发现无论做什么都会弹出一条讨厌的提示,说没有权限执行等等... 网上有介绍登入root用户,或者去grub的 ...

  10. [转]Visual Studio技巧之打造拥有自己标识的代码模板

    可能经过很多博客的介绍,大家都知道代码段的使用,使用代码段可以很方便地生成一些常用的代码格式,确实对我们开发很方便.在团队开发中或者在某些情况下我们经常可能还会希望使用Visual Studio生成的 ...