超过一定高度对象自动悬浮

<script type="text/javascript">
    var navH = document.getElementById(‘id‘).offsetTop;//获取要定位元素距离浏览器顶部的距离
    window.onscroll = function(){
        var scroH = document.documentElement.scrollTop || document.body.scrollTop;//获取滚动条的滑动距离
        var bar = document.getElementById(‘id‘);
        if(scroH>=navH){//滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定,反之就不固定
            bar.style.position  = "fixed";
            bar.style.top  = "0px";
        }else if(scroH<navH){
            bar.style.position  = "static";
        }
    }
</script>

可以根据实际需要效果更改if和else里面的属性。

时间: 2024-10-10 20:20:10

超过一定高度对象自动悬浮的相关文章

如何实现大图居中超过的部分两边自动隐藏

现在大多数用的显示器都是大屏的,所以我们美工在设计海报时都会用大图,但还是有一部分朋友是用小屏幕,那么,如何实现大图居中超过的部分两边自动隐藏呢?ytkah也遇到这样的情况,一起来看看怎么解决吧 <div style="overflow: hidden; width: 1920px; height:623px;"> <img style="margin-left:-960px; position: absolute; left: 50%;" src

CSS教程:div设置float后高度不自动增加

本来想把这个题目修改为“闭合浮动元素”或“清除浮动元素”,但想了一下,还是不修改为好.因为从这个题目我们可以更加容易的看出,如果您没有闭合(清除)浮动元素,它将造成的后果是-----div的高度不能自动增加.言归正传目前用来清除“闭合(清除)浮动”的方法,主要是一下四种:1.额外标签法这种方法就是向父容器的末尾再插入一个额外的标签,并令其清除浮动(clear)以撑大父容器.这种方法浏览器兼容性好,没有什么问题,缺点就是需要额外的(而且通常是无语义的)标签.我个人不喜欢这种方法,但是它确实是W3C

mysql完整备份,超过十天的自动删除

#!/bin/bash #Author [email protected] cd /sqlbak /usr/local/mysql/bin/mysqladmin -uroot -p123456 flush-logs MAXIMUM_BACKUP_FILES=10 BACKUP_FOLDERNAME="database_backup" DB_HOSTNAME="localhost" DB_USERNAME="root" DB_PASSWORD=&q

对象自动装配器

一.有朋友说数据封装到对象很是麻烦,最喜欢hibernate的地方就是操作数据简单了.其实我想说的是框架都是对基本操作的高级封装.就如数据封装到对象,闲来无事,就简单做了个对象自动装配器.大家可以研究下.当然有兴趣的朋友可以进行功能扩充. 二.对象自动装配器,顾名思义就是通过简单的配置让程序帮我们把数据填充到对象. 三.很多朋友都知道,查询对象的步骤就是:获取数据库的连接-->构建查询语句-->获取PreparedStatement-->获取ResultSet结果集,最后我们就是把数据填

python学习之路之案例0(实现登录功能,登录错误次数超过3次,自动退出登录)

一.整个案例运用到的知识点 1.python字典.字符串.列表的灵活转换和使用 2.python数据结构之字符串:字符串的格式化.字符串的去空格(strip()) 3.python数据结构之字典:字典的构建.字典和字符串的转换 4.python数据结构列表:列表的构建.列表和字符串的转换 5.if....else....判断的使用 6.for循环.while True死循环的使用 5.文件的打开.读取.关闭等功能的使用 二.整个案例的设计的中心思想 1.首先读取用户表文件里面的字符串:包括用户名

C# 实现winform自动悬浮

winform自动悬浮,主要代码如下: 1 using System; 2 using System.Collections.Generic; 3 using System.ComponentModel; 4 using System.Data; 5 using System.Drawing; 6 using System.Text; 7 using System.Windows.Forms; 8 9 namespace SupremeWindowsForms 10 { 11 public pa

自适应高度 UILabel自动折行

UILabel *label = [[UILabel alloc] initWithFrame:CGRectMake(10, 100, 300, 50)]; label.text = @"今天下午全市多云到阴有阵雨或雷雨,今天夜里到明天阴有阵雨,雨量可达大雨. 东北风5-6级阵风7级,逐渐增强到6-7级阵风8级. 今天最高气温:26左右, 明晨最低气温:22左右. 今晨最低气温:21. 今日紫外线等级:2级,照射强度弱,适当防护. 明日洗车指数:4级,天气有雨,不宜洗车."; //清空

超好用的移动端布局自适应大小rem判断js文件及超过一定高度回到顶部按钮代码

//以下代码放到一个adapt.js文件当中 (function (doc, win) {   var docEl = doc.documentElement,     resizeEvt = 'orientationchange' in window ? 'orientationchange' : 'resize',     recalc = function () {       var clientWidth = docEl.clientWidth;       if (!clientWi

javabean对象自动赋值给另一个javabean对象

方法1:把JavaBean的from的值自动set给to,省略了自己从from中get然后再set给to import java.beans.BeanInfo;import java.beans.Introspector;import java.beans.PropertyDescriptor;import java.lang.reflect.Method; public static Object convertBean2Bean(Object from, Object to) { try {