这是一个简单的jQuery插件,它能让页面目标元素 “固定” 在浏览器窗口的顶部,即便页面在滚动,目标元素仍然能出现在设定的位置。此插件可以在多页面的网站上工作,也能在单页面上面实现导航功能。滚动当前页面看看导航条的效果吧。

现在就可以将stickUp所包含的的javascript文件加载到你的页面中了。拷贝下面的代码,粘贴到页面底部。务必确保javascript文件的路径正确无误。

<script src="js/stickUp.min.js"></script>
          
接下来,将下面的代码拷贝粘贴到页面底部,并且放到前面引入的stickUp文件下面。或者,你也可以将下面的代码放倒已经存在的javascript文件中(这个文件也必须在stickUp文件下面)。将 '.navbar-wrapper' 替换为目标元素的class名称。

<script type="text/javascript">
              //initiating jQuery
              jQuery(function($) {
                $(document).ready( function() {
                  //enabling stickUp on the '.navbar-wrapper' class
                  $('.navbar-wrapper').stickUp();
                });
              });

</script>
          
就这么简单!

更多 详细功能见 http://www.bootcss.com/p/stickup/

stickUp 一个 jQuery 插件相关推荐

  1. 实现你人生中的第一个jQuery插件

    前言 本想把本篇取名:从0开始写前端UI框架:实现你人生中的第一个jQuery插件 ,但感觉标题太长,所以简单明了直接取后面主题为题目吧. 前一篇文章 已经对my-ui框架做了简单的介绍.谈到了我是如 ...

  2. 所谓 jQuery 插件,怎样开发一个 jQuery 插件

    简单来说,所谓 jQuery 插件就是扩展在 jQuery 原型对象上的一个方法.通过扩展 jQuery 对象,每次调用 jQuery 对象的时候,对象里面都包含了我们自己所添加的那个方法. 一般插件 ...

  3. 如何编写一个Jquery插件

    首先我们来搞清楚一些关于Jquery插件的知识: 一.插件的种类: 封装对象方法的插件 这种插件是将对象方法封装起来,用于对通过选择器获取的jQuery对象进行操作,是最常见的一种插件 封装全局函数的 ...

  4. 发布一个jQuery插件:formStorage

    中午休息时,没有睡意,没事写了个jquery插件:formStorage. 原理很简单,通过本地存储机制(userData或者localStorage),存储表单中元素的状态到本地. 需要时可以把所存 ...

  5. 如何去定义一个jquery插件

    扩展jquery的时候.最核心的方法是以下两种: $.extend(object) 可以理解为jquery添加一个静态方法 $.fn.extend(object) 可以理解为jquery实例添加一个方 ...

  6. 我写的第一个jquery插件:jquery.photoFrame(version 0.2)

    先看效果 introduce     jQuery photoframe plugin     A useful plugin to beautify image or text by wrappin ...

  7. 自己在项目中写的一个Jquery插件和Jquery tab 功能

    后台查询结果 PDFSearchResult实体类: [DataContract(Name = "PDFSearchResult")]public class PDFSearchR ...

  8. 自己动手写一个JQuery插件(第二篇)(转)

    1.Hold住,我们要开始动真格了! 是的,看到这个标题,你一定也和我一样迫不及待了,因为我们不像之前那篇教程一样小打小闹了,我们现在要动真格了,这次我们要写的插件是上个插件的增强版本.而这个插件包含 ...

  9. 发布一个jquery插件--在Web下输入密码时提示大写锁定键(2012-05-03 10:20最后修改)...

    功能介绍: 在Web下输入密码时提示大写锁定键,封装成jq插件方便有需要的同学! 使用: $("#txtPWD").capsLockTip(); 截图预览: 代码(2012-05- ...

最新文章

  1. WAIC 2021 | 百度量子计算段润尧:从理论到实践谈量子人工智能
  2. VS下对Resx资源文件的操作
  3. [POJ] 3687 Labeling Balls(拓扑排序)
  4. 征途2无法显示服务器列表,解决win10系统玩征途2提示“DriverCommlnit驱动加载失败”的方法...
  5. Android Studio 导入 AOSP 源码
  6. 自然语言处理 —— 2.1 词汇表征
  7. unity打开一片黑_你的面膜上黑!名!单!了!吗!
  8. Java并发包源码学习之AQS框架(三)LockSupport和interrupt
  9. 机器学习十大经典算法——knn
  10. win10 visualBox 新建虚拟机出现 UUID 错误
  11. 12款高质量的免费 HTML 网页模板下载
  12. 测试基本理论-看这篇就够了
  13. 设置自定义电脑屏幕分辨率
  14. GPS定位原理、系统组成及工作频段
  15. c语言:输入三角形的边长求面积
  16. 模拟电路虚短 虚断
  17. 大学英语精读第三版(第三册)学习笔记(原文及全文翻译)——8B - Dreams — What Do They Mean?(梦意味着什么?)
  18. 解决MAC上Django连接Mysql django.db.utils.OperationalError: (2003, Can't connect to MySQL 的问题
  19. 目标检测类mAP等衡量指标的含义和计算方法
  20. grep同时过滤多个条件

热门文章

  1. 业财一体化,他们这么看丨创新场景50沙龙实录总结
  2. 第一批鸿蒙系统手机型号,华为鸿蒙第一批名单
  3. Web功能测试笔记02 ——读《Web测试囧事》
  4. 诚邀各界人士共赏--2011年百度运维部迎新生晚会
  5. CV牛人牛事简介之一
  6. [hiveSQL面试题3]
  7. 正则语法+JavaScript的正则使用
  8. 小学校计算机教室年度工作总结,计算机教师年终个人工作总结
  9. 不要钱的“门店”,年营收400万,这个点子你该借鉴一下
  10. 用python实现BMI的计算