<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>scrollTop</title>
<style>
#div1{width: 200px;height: 150px;background: red;position: absolute;right: 0;bottom: 0;}
body{height: 2000px;}
</style>
</head>
<body>
<div id="div1"></div>
<script>
//clientHight 可视区高度
//offsetHight 物体的高度

//IE FF
//alert(document.documentElement.scrollTop);

//chrome
//alert(document.body.scrollTop)

//IE6下的固定定位是不可行的 fixed不可用 scrollTop+clientHight-offsetHight(能够把div固定在可视区下方)

window.onscroll = window.onresize = function(){
var oDiv = document.getElementById("div1");
var scrollTop = document.documentElement.scrollTop || document.body.scrollTop;//滚动条的垂直位置

oDiv.style.top = document.documentElement.clientHeight-oDiv.offsetHeight + scrollTop + "px";

}

</script>
</body>
</html>

scrollTop实例的更多相关文章

  1. 深度理解Jquery 中 scrollTop() 方法

    这是工作遇到scrollTop() 方法.为了强化自己,把它记录在博客园当中. 下面就开始scrollTop 用法讲解: scrollTop() 定义和用法 scrollTop() 方法设置或返回被选 ...

  2. 最近学习工作流 推荐一个activiti 的教程文档

    全文地址:http://www.mossle.com/docs/activiti/ Activiti 5.15 用户手册 Table of Contents 1. 简介 协议 下载 源码 必要的软件 ...

  3. scrollTop实现图像循环滚动（实例1）

    <html><head><title>scrollTop实现图像循环滚动(实例1)</title><meta http-equiv="C ...

  4. jQuery动画效果animate和scrollTop结合使用实例

    CSS属性值是逐渐改变的,这样就可以创建动画效果.只有数字值可创建动画(比如 "margin:30px").字符串值无法创建动画(比如 "background-color ...

  5. jQuery中animate与scrollTop、offset().top实例

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. scrollTop,scrollHeight,clientTop,clientHeight,offsetTop,offsetHeight实际意义 及 计算方式 附实例说明

    一.滚动距离.高度 scrollTop scrollLeft scrollHeight scrollWidth 二.相对位置.距离 offsetTop offsetLeft offsetHeight ...

  7. 十分钟玩转 jQuery、实例大全

    一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库.源码戳这 jQuery对象 jQuery产 ...

  8. jquery简介和实例

    一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. 参考:http://www.php100 ...

  9. python: DOM 小实例

    一.全选 全部取消  反选 全选:选择指定的所有项目. 全部取消: 取消所有选定的项目. 反选: 选择未选定的,之前已选定的则取消. <!DOCTYPE html> <html la ...

随机推荐

  1. mybatis 查询返回的类型中字段类型为 List<xx>

    基本类型数组 mapper.xml <resultMap id="xxDtoResultMap" type="com.xx.xxDto"> < ...

  2. MySQL分库分表-理论

    分库分表的几种方式 把一个实例中的多个数据库拆分到不同的实例 把一个库中的表分离到不同的数据库中 数据库分片前的准备 在数据库并发和负载没有达到限制时,不推荐水平拆分 对一个库中的相关表进行水平拆分到 ...

  3. hadoop联合hive基础使用

    sqoop路径:/opt/module/sqoop 把指定文件放到hadoop指定路径:hadoop fs -put stu1.txt /user/hive/warehouse/stu hive启动( ...

  4. .NET程序设计实验2

    1.设计编写一个控制台应用程序,练习类的继承. (1) 编写一个抽象类 People,具有"姓名","年龄"字段,"姓名"属性,Work 方 ...

  5. 第06组 Beta冲刺 (5/5)

    目录 1.1 基本情况 1.2 冲刺概况汇报 1.郝雷明 2. 方梓涵 3.曾丽莉 4.黄少丹 5. 董翔云 6.鲍凌函 7.杜筱 8.詹鑫冰 9.曹兰英 10.吴沅静 1.3 冲刺成果展示 1.1 ...

  6. 20212115 实验二 《python程序设计》实验报告

    实验二 计算器设计 #20212115 2021-2022-2 <python程序设计> 实验报告二 课程: 课程:<Python程序设计>班级: 2121姓名: 朱时鸿学号: ...

  7. Python Django 功能模块

    Python Django模块 Django模块,是针对有django基础,对django功能进行模块化,方便下次使用. 一.注册模块 该注册采用邮箱验证,注册成功后会发送激活链接到邮箱. 邮箱验证参 ...

  8. 关于spring整合mybatis

    第一步导入依赖 <dependencies> <dependency> <groupId>org.mybatis</groupId> <artif ...

  9. Xilinx DMA的几种方式与架构

    DMA是direct memory access,在FPGA系统中,常用的几种DMA需求: 1. 在PL内部无PS(CPU这里统一称为PS)持续干预搬移数据,常见的接口形态为AXIS与AXI,AXI与 ...

  10. Python参数传递中的 args, kwargs

    概念 真正的Python参数传递语法是*和**,其被称为 被称为打包和解包参数.*args和**kwargs只是大家默认的一种形式.也可以写成*keys和**kkeys等其他形式.二者都是为了在不知道 ...