<html>
<head>
<title>slide</title>
<style type="text/css">
#example1 {width:690px;height:3000px;margin:0 auto;background:#ccc;margin-top:200px;}
#example2 {width:690px;height:2000px;margin:0 auto;background:#eee;}
#navcaidan {width:690px;height:50px;background:black;color:#FFFFFF;margin:0 auto;position:fixed;top:0;left:50%;margin-left:-345px;display:none}
</style>
</head>
<body>
<div id='example1'><></a></div>
<div id='example2'>232323</div>
<div id='navcaidan'>232323</div>
</body>
<script type="text/javascript">
var divMenu = document.getElementById("example1");
var navcaidan = document.getElementById("navcaidan");
function getPageTop(obj){
var ju=0;
ju=ju+obj.offsetTop;
var p=obj.offsetParent;
while(p){
ju=ju+p.offsetTop;
p=p.offsetParent;
}
return ju;
}
var tp=getPageTop(divMenu);
window.onscroll=function(){
var s=document.documentElement.scrollTop||document.body.scrollTop;
if(s>tp){
navcaidan.style.display = "block";
}else{
navcaidan.style.display = "none";
}
}
</script>
</html>

距离顶部估计像素，显示div！的更多相关文章

  1. js计算元素距离顶部的高度及元素是否在可视区判断

    前言: 在业务当中,我们经常要计算元素的大小和元素在页面的位置信息.比如说,在一个滚动区域内,我要知道元素A是在可视区内,还是在隐藏内容区(滚动到外边看不到了).有时还要进一步知道,元素是全部都显示在 ...

  2. js获取元素的滚动高度，和距离顶部的高度

    jq: 获取浏览器显示区域(可视区域)的高度 : $(window).height(); 获取浏览器显示区域(可视区域)的宽度 : $(window).width(); 获取页面的文档高度 $(doc ...

  3. 鼠标划过用户名时在鼠标右下角显示div展示用户资料

    最近做一个网站论坛,为了方便会员之间相互了解,又不想再做一个页面展示用户资料,就想到了鼠标划过用户名时在鼠标右下角显示div展示用户资料这个效果, 这里要注意的该方法不是给每个用户名的旁边都绑定一个d ...

  4. React 点击按钮显示div与隐藏div，并给div传children

    最近做了一个react的点击按钮显示与隐藏div的一个小组件: [筛选]组件FilterButton import React,{Component} from 'react'; import {re ...

  5. html页面显示div源代码：用<xmp></xmp>标签

    html页面显示div源代码:用<xmp></xmp>标签效果还可以.

  6. js或jquery实现点击某个按钮或元素显示div,点击页面其他任何地方隐藏div

    点击某个元素显示div,点击页面其他任何地方隐藏div,可用javascript和jquery两种方法实现: 一:javascript实现方法技巧<script>//定义stopPropa ...

  7. CSS鼠标悬浮DIV后显示DIV外的按钮

    昨天写样式遇到个问题,如何让鼠标悬浮DIV后,显示DIV外的按钮,可以点击到按钮. 效果如下: 问题: 在DIV hover时候将按钮设为display: block,这是很直接的想法,但是这有个问题 ...

  8. 1016-06-首页20-封装工具条---UITableView控件距离顶部的间距问题----cell选中时的背景颜色设置

    一.设置UITableView里面的顶部 cell 距离顶部的间距的三种方式: 方法 1. 直接设置: self.tableView.contentInset = UIEdgeInsetsMake(H ...

  9. 用JS把复选框做成单选框,左显示div,右隐藏div

    <input type="checkbox" name="checkname" onclick="check(this)"/>左 ...

随机推荐

  1. 深入浅出scanf、getcha、gets、cin函数

    转:问题描述一:(分析scanf()和getchar()读取字符) scanf(), getchar()等都是标准输入函数,一般人都会觉得这几个函数非常简单,没什么特殊的.但是有时候却就是因为使用这些 ...

  2. 有时summary的状态和details是否有open属性有关

    用过mac的同学对这个界面一定很熟悉,因为这个界面和我们今天要说的details有很多相近的地方,首先,其有折叠效果,用户可以自己选择打开或关闭哪一个,其次,当我们直接打开的时候,默认会有几个标签是打 ...

  3. Ubuntu常用命令与技巧

    sudo apt-get install 软件名 安装软件命令 sudo nautilus 打开文件(有root权限) su root 切换到“root” ls 列出当前目录文件(不包括隐含文件) l ...

  4. JavaScript对象基础知识

    1.对象所包含的元素一组包含数据的属性.如人的名字.书的价格和手机型号等.允许对属性中所包含的数据进行操作的方法. 2.引用对象的途径一个对象真正地被使用,可以采用以下几种方式.引用Javascrip ...

  5. AS3读取加密XML

    首先要确定xml使用了哪些加密方式,这样在As3中就反过来解密. 我加密xml的方式是先将xml文件打包为一个压缩文件,然后将压缩文件进行RC4加密,最后用base64将加密过的压缩包转为base64 ...

  6. paip.hadoop的应用研究总结

    paip.hadoop的应用研究总结 作者Attilax ,  EMAIL:1466519819@qq.com  来源:attilax的专栏 地址:http://blog.csdn.net/attil ...

  7. inconvertible types; cannot cast 'android.supoort.v4.app.Fragment' to 'com.example.sevenun.littledemo.fragment.NewsTitleFragment'

    inconvertible types; cannot cast 'android.supoort.v4.app.Fragment' to 'com.example.sevenun.littledem ...

  8. Shiro学习详解

    1.Shiro基本架构 一.什么是Shiro Apache Shiro是一个强大易用的Java安全框架,提供了认证.授权.加密和会话管理等功能: 认证 - 用户身份识别,常被称为用户“登录”: 授权 ...

  9. log4j 突然不打印记录，提示：No appenders could be found for logge，处理方法

    log4j 一直都在使用正常,log4j.xml配置.代码都没有修改,突然不打印记录,出现下面提示: log4j:WARN No appenders could be found for logger ...

  10. phoneGap开发环境搭建(android)

    1．  首先安装nodejs  (http://nodejs.org/) 2．  然后在命令行输入 npm 回车 假设出现下图: 则表示成功安装 3. 安装 npm install -g cordov ...