滚动侦测scrollspy
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
<title>Amaze UI Examples</title>
<link rel="stylesheet" href="assets/css/amazeui.min.css">
<!-- <link rel="stylesheet" href="assets/css/app.css">-->
</head>
<body>
<div style="height: 800px;"></div>
<div class="am-panel am-panel-primary" id="my-scrollspy">
<div class="am-panel-hd">ScrollSpy via JS
</div>
<div class="am-panel-bd">
生命是一团欲望，欲望不满足便痛苦，满足便无聊。人生就在痛苦和无聊之间摇摆。——叔本华
</div>
</div>
<div class="am-panel am-panel-primary" id="my-scrollspy2">
<div class="am-panel-hd">ScrollSpy via JS
</div>
<div class="am-panel-bd">
生命是一团欲望，欲望不满足便痛苦，满足便无聊。人生就在痛苦和无聊之间摇摆。——叔本华
</div>
</div>
<!--[if lt IE 9]>
<script src="http://libs.baidu.com/jquery/1.11.1/jquery.min.js"></script>
<script src="http://cdn.staticfile.org/modernizr/2.8.3/modernizr.js"></script>
<script src="assets/js/amazeui.ie8polyfill.min.js"></script>
<![endif]-->
<!--[if (gte IE 9)|!(IE)]><!-->
<script src="assets/js/jquery.min.js"></script>
<!--<![endif]-->
<script src="assets/js/amazeui.min.js"></script>
<script>
$(function() {
//eg
$('#my-scrollspy').scrollspy({
animation: 'slide-left',
delay: 500
})
$('#my-scrollspy2').scrollspy({
animation: 'fade',
delay: 1000
})
});
</script>
</body>
</html>
滚动侦测scrollspy的更多相关文章
- react搭配amazeui环境搭建
1.安装node https://nodejs.org/en/download/ 查看node npm版本 2.安装react 创建新的react单页面应用 npm install -g cre ...
- 前端组件库 - 搭建web app常用的样式/组件等收集列表(移动优先)
0. 前端自动化(Workflow) 前端构建工具 Webpack - module bundler Yeoman - a set of tools for automating developmen ...
- amazeui中的js插件有哪些（详解功能）
amazeui中的js插件有哪些(详解功能) 一.总结 一句话总结: 二.amazeui中的js插件有哪些 1.UI 增强 警告框Alert 按钮交互Button 折叠面板Collapse 下拉组件D ...
- bootstrap3-javascript插件- 慕课笔记
bootstrap支持的js插件 说明:文中内容系本人在某网站学习笔记,本着本站禁止推广的原则,在此就不著明学习站点的名称及地址.其实开博客的目的也就是为了方便记录学习,因为平时本地的记录太多丢三落四 ...
- Bootstrap滚动监控器
前面的话 滚动监听插件是用来根据滚动条所处的位置来自动更新导航项的.滚动导航条下面的区域并关注导航项的变化,下拉菜单中的条目也会自动高亮显示.本文将详细介绍Bootstrap滚动监控器 基本用法 滚动 ...
- BootStrap入门教程 (四) ：JQuery类库插件（模态窗口，滚动监控，标签效果，提示效果，“泡芙”效果，警告区域，折叠效果，旋转木马，输入提示）
上讲回顾:Bootstrap组件丰富同时具有良好可扩展性,能够很好地应用在生产环境.这些组件包括按钮(Button),导航(Navigation),缩略图( thumbnails),提醒(Alert) ...
- Bootstrap JavaScript插件
在bs3.X中,提供了12种JavaScript插件,分别是:动画过渡(Transition).模态弹窗(Modal).下拉菜单(Dropdown).滚动侦测(Scrollspy).选项卡(Tab ...
- Bootstrap-17
导入JavaScript插件: 一次性导入:Bootstrap提供了一个单一的文件,这个文件包含了Bootstrap的所有JavaScript插件,即bootstrap.js <!—导入jQue ...
- [Bootstrap]7天深入Bootstrap(5)JavaScript插件
在bs3.X中,提供了12种JavaScript插件,分别是:动画过渡(Transition).模态弹窗(Modal).下拉菜单(Dropdown).滚动侦测(Scrollspy).选项卡(Tab). ...
随机推荐
- Oracle中查询主键、外键、sequence、表基本信息等
一次看到某张表中有几条ID相同的数据,通过业务确认该ID应该是唯一的,后来找到原因,因为DBA未对该表建主键. 现在DBA工作比较忙,我们项目有时需要新增或者修改数据库表结构时,可能需要对表结构进行确 ...
- java获取Mp3播放时长
最近有一个用java获取mp3播放时长的需求,有两种,一种本地文件,一种网络文件,其中获取网络mp3播放时间的方法找了挺久终于找到个能用的了. 第一种很简单,下载个jar包 jaudiotagger ...
- 视觉SLAM之词袋（bag of words） 模型与K-means聚类算法浅析（1）
在目前实际的视觉SLAM中,闭环检测多采用DBOW2模型https://github.com/dorian3d/DBoW2,而bag of words 又运用了数据挖掘的K-means聚类算法,笔者只 ...
- shell脚本中判断一个字符串是否是空字符串
需求说明: 在写脚本的时候,有的时候,需要判断一个字符串是否为空,因此,在此写出如何判断一个字符串为空的方法. 简单来说,就是字符串的比较. 测试脚本: 以下的脚本用于测试str_1和str_2是否是 ...
- 使用 MVVMLight 消息通知
欢迎阅读我的MVVMLight教程系列文章<关于 MVVMLight 设计模式系列> 在文章的其实我们就说了,MVVMLight的精华就是消息通知机制,设计的非常不错.这个东西在MVVML ...
- 聊聊iOS中TCP / UDP 协议
TCP (Transmission Control Protocol)和UDP(User Datagram Protocol)协议属于 传输层协议. UDP(User Datagram protoco ...
- Python Scrapy 自动爬虫注意细节（2）
一.自动爬虫的创建,需要指定模版 如: scrapy genspider -t crawl stockinfo quote.eastmoney.com crawl : 爬虫模版 stockinfo : ...
- Python 练习题：计算 MAC 地址
#!/usr/bin/env python #-*- coding:utf-8 -*- ''' 给一个MAC地址加1 ''' mac = '52:54:00:e6:b2:0a' prefix_mac ...
- Mybatis中的foreach
<delete id="deleteByParam"> DELETE FROM YZ_SECURITIES_CURRENCY WHERE ID IN <forea ...
- SQL 根据日期精确计算年龄
SQL 根据日期精确计算年龄 第一种: 一张人员信息表里有一人生日(Birthday)列,跟据这个列,算出该人员的年龄 datediff(year,birthday,getdate()) 例:birt ...