滚动侦测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). ...
随机推荐
- ZOJ 3436 July Number(DFS)
题意 把一个数替换为这个数相邻数字差组成的数 知道这个数仅仅剩一位数 若最后的一位数是7 则称原来的数为 July Number 给你一个区间 求这个区间中July Number的个数 ...
- dwr框架使用总结——简单示例
1.新建web项目,项目名为dwr 2.导入以下jar包: dwr.jar.classes12.jar.commons-logging-1.0.4.jar和commons-logging.jar 3. ...
- jQuery对象的链式操作用法分析
可以使用下面的原则判断一个函数返回的时候是jQuery对象,即是否可以用于链式操作. 除了获取某些数据的函数,比如获取属性值"attr(name)",获取集合大小"siz ...
- About {DynamicResource {x:Static SystemColors.ControlBrushKey}}
from : http://blog.sina.com.cn/s/blog_749e42850100sahi.html 前提: <system:String x:Key="{Compo ...
- [extjs] ExtJS 4.2 开发环境搭建
到官网下载Extjs ,现在最新版的是Ext5.1. 这里用ext4.2演示开发.http://extjs.org.cn/. EXT4.1 在线API 项目结构中ext4.2导入的资源文件: 第一个页 ...
- MyException--org.apache.ibatis.exceptions.PersistenceException: ### Error building SqlSession. ###
org.apache.ibatis.exceptions.PersistenceException: ### Error building SqlSession. ### The error may ...
- angularjs基础——变量绑定
1)弄一个ng-app(angularjs 应用) 2)在里面用ng-model(angularjs 模型)就可以定义一个模型变量 3)使用模版方法就可以输出变量了(例如:{{name}}) 示例: ...
- linux命令之find和locate
1.find / -name log.xml 按照名字查找log.xml文件 2.locate log.xml 查找log.xml文件(效率高) 3.grep 'hive' word. ...
- MUI 单个图片上传预览（拍照+系统相册）：先选择->预览->上传提交
1 html部分 <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> < ...
- LeetCode——Product of Array Except Self
Description: Given an array of n integers where n > 1, nums, return an array output such that out ...