滚动侦测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). ...
随机推荐
- BleedTree动画混合树
通过Unity动画状态机,能帮我们轻松处理转换各个动画片断,达到想要的效果,但是如果仅仅是一个个动画的硬生生的切换,那么看起来就非常突然,而不真实了,在质量要求比较高的游戏中,特别是动作游戏,我们就不 ...
- oracle的常用函数 instr() 和substr()函数
from:http://1055592535.iteye.com/blog/1676235 在Oracle中 可以使用instr函数对某个字符串进行判断,判断其是否含有指定的字符. 在一个字符串中查找 ...
- Linux上Nginx部署配置
一.下载软件 openssl-fips-2.0.10.tar.gz pcre-8.40.tar.gz zlib-1.2.11.tar.gz nginx-1.10.2.tar.gz gcc-c++ 下载 ...
- GIS-ArcGIS 数据库备份还原
Create directory sdebak as 'E:\10_DataFile'; alter system set deferred_segment_creation=false; ALTER ...
- GIS-009-Cesium 使用
//加载ArcGIS 发布的地图服务MapServervar url='http://Jason:6080/arcgis/rest/services/SampleWorldCities/MapServ ...
- piblog 0.2
在一个Web App中,所有的数据,包括用户的信息,日志,评论等,都存在数据库中.在piblog中使用MySQL作为数据库.Web App中由很多地方需要使用数据库.访问数据库需要创建数据库连接.游标 ...
- 虚拟机怎么设置u盘启动
方法/步骤 1 运行你安装的虚拟机 步骤阅读 2 点击绿色的按钮,把你的虚拟机下面的系统启动. 步骤阅读 3 让你的虚拟系统处于可以按“Ctrl+Alt+Insert”重启的界面.比如我让虚拟系统 ...
- poj_1236 强连通分支
题目大意 有N个学校,这些学校之间用一些单向边连接,若学校A连接到学校B(B不一定连接到A),那么给学校A发一套软件,则学校B也可以获得.现给出学校之间的连接关系,求出至少给几个学校分发软件,才能使得 ...
- linux主机下的Vmware Workstation配置NAT设置 端口映射-Ubuntu为例
最近折腾虚拟机,由于是在linux下进行的,而相关资料比较少,所以遇到了一些问题. 一个就是配置vmware workstation的NAT设置.因为一般来说,NAT可以共享主机的ip,从而能以主机身 ...
- 从TCP三次握手说起–浅析TCP协议中的疑难杂症(2)
版权声明:本文由黄日成原创文章,转载请注明出处: 文章原文链接:https://www.qcloud.com/community/article/108 来源:腾云阁 https://www.qclo ...