回顾scroll
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>scroll</title>
<script src="jquery-1-12-1.js"></script>
</head>
<style>
*{
margin: 0;
padding: 0;
list-style: none;
}
.header{
width: 100%;
height: 50px;
position: fixed;
left: 0;
top: -50px;
background:red;
}
body{
height: 3000px;
}
</style>
<body>
<div class="header"> </div>
</body>
<script>
$(function(){
var flagdnow=true;
var flagup=true;
window.onscroll = function(){
var scroll = $(document).scrollTop();
if(scroll >= 400){
if(flagdnow){
$(".header").animate({top:0})
flagdnow=false;
flagup=true;
}
}
else{
if(flagup){
$(".header").animate({top:"-50px"})
flagdnow=true;
flagup=false;
}
}
}
})
</script>
</html>
回顾scroll的更多相关文章
- JavaScript中作用域回顾（避免使用全局变量）（瀑布流的实现）（scroll事件）以及Django自定义模板函数回顾
页面显示照片样式为瀑布流: 上面的div个数可以按照自己安排进行划分.img的分布可以使用模板标签以及自定义模板函数进行排布: 自定义模板函数实现可以看,最后几列:python---django中模板 ...
- offset系列,client系列,scroll系列回顾
一 scroll系列属性 ——滚动
- Python之路【第十四篇】前端补充回顾
布局和事件 1.布局 首先看下下面的图片: 上面的内容都是居中的,怎么实现这个效果呢,第一种方法是通过float的方式,第二种是通过“div居中的方式” 第一种方式不在复述了,直接看第二种方式: 1. ...
- iOS回顾笔记（04） -- UIScrollView的基本使用详解
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,bi ...
- VS2010/MFC编程入门之二十六（常用控件：滚动条控件Scroll Bar）
回顾上一节,鸡啄米讲的是组合框控件Combo Box的使用.本节详解滚动条控件Scroll Bar的相关内容. 滚动条控件简介 滚动条大家也很熟悉了,Windows窗口中很多都有滚动条.前面讲的列表框 ...
- 前端知识点回顾——HTML，CSS篇
前端知识点回顾篇--是我当初刚转行为了面试而将自己学过的前端知识整理成的一份笔记,个人目的性很强,仅供参考. doctype 有什么用 doctype是一种标准通用标记语言的文档类型声明,目的是告诉标 ...
- Elasticsearch系列---搜索执行过程及scroll游标查询
概要 本篇主要介绍一下分布式环境中搜索的两阶段执行过程. 两阶段搜索过程 回顾我们之前的CRUD操作,因为只对单个文档进行处理,文档的唯一性很容易确定,并且很容易知道是此文档在哪个node,哪个sha ...
- [C#] C# 基础回顾 - 匿名方法
C# 基础回顾 - 匿名方法 目录 简介 匿名方法的参数使用范围 委托示例 简介 在 C# 2.0 之前的版本中,我们创建委托的唯一形式 -- 命名方法. 而 C# 2.0 -- 引进了匿名方法,在 ...
- 【前端性能】高性能滚动 scroll 及页面渲染优化
最近在研究页面渲染及web动画的性能问题,以及拜读<CSS SECRET>(CSS揭秘)这本大作. 本文主要想谈谈页面优化之滚动优化. 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的 ...
随机推荐
- iOS应用架构谈part3 网络层设计方案
前言 网络层在一个App中也是一个不可缺少的部分,工程师们在网络层能够发挥的空间也比较大.另外,苹果对网络请求部分已经做了很好的封装,业界的AFNetworking也被广泛使用.其它的ASIHttpR ...
- Node项目实战-静态资源服务器
打开github,在github上创建新项目: Repository name: anydoor Descripotion: Tiny NodeJS Static Web server 选择:publ ...
- 好久没写了，总结一下lnux常用的命令（基础）
Linux 1.init 0 关机 2.init 6 重启 3.ls 列出当前目录下的文件 4.cd 切换目录 cd - 切换最近使用的两次目录 5.pwd 查看当前所在的路径 (“-”为用户 ...
- 浅探webpack优化
由于前端的快速发展,相关工具的发展速度也是相当迅猛,各大框架例如vue,react都有自己优秀的脚手架工具来帮助我们快速启动一个新项目,也正式因为这个原因,我们对于脚手架中最关键的一环webpack相 ...
- destoon 后台管理左侧新增菜单项
destoon 后台菜单设置在对应模块的admin/menu.inc.php 例如要在后台会员管理里增加会员承包和股东管理 $menu = array( array('添加会员', '?modulei ...
- tp5使用外部类的三种方法
在tp5中使用外部类的时候有三种方法 第一种就是通过composer下载,通过这种方式下载的外部类能够支持自动加载,我们只要在使用的时候use一下命名空间就可以使用了 比如:我们的tp5第四季项目要使 ...
- python并发编程之线程(创建线程,锁(死锁现象,递归锁),GIL锁)
什么是线程 进程:资源分配单位 线程:cpu执行单位(实体),每一个py文件中就是一个进程,一个进程中至少有一个线程 线程的两种创建方式: 一 from threading import Thread ...
- 跟踪路由 tracert
由于最近遇到网络出现故障的问题,便使用到Tracert来确定了下出现故障的网络节点 记录下tracert命令相关内容 1. 简介 2. Tracert工作原理... 3. 常用参数 4. 使用示例与输 ...
- CentOS7.2下Hadoop2.7.2的集群搭建
1.基本环境: 操作系统: Centos 7.2.1511 三台虚机: 192.168.163.224 master 192.168.163.225 node1 192.168.163.226 ...
- LightOj：1422-Halloween Costumes
传送门:http://www.lightoj.com/volume_showproblem.php?problem=1422 Halloween Costumes problem descriptio ...