博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
实现某元素上滑至顶端时固定悬浮
阅读量:5082 次
发布时间:2019-06-13

本文共 1162 字,大约阅读时间需要 3 分钟。

.afix{

position:fixed;
top:45px;
z-index:100;
}
.fix{
position:fixed;
top:0px;
z-index:100;
}

.parent {

background: white;
width: 100%;
border-bottom: 1px solid #FFF;
}

window.οnscrοll= function(){

//变量t是滚动条滚动时,距离顶部的距离
//var current =document.documentElement.scrollTop;

var currnet = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop;

var obj = $('.parent')[0];
var hig =$('#source_container').height();
var isAndroid = u.indexOf('Android') > -1|| u.indexOf('Linux') > -1;
var css ='fix';
if(isAndroid){
css = 'afix';
}
if(hig-current<50){
var obj = $('.parent')[0];
$(obj).addClass(css);// ('position','fixed');
}else{
if($(obj).hasClass(css))
{
$(obj).removeClass(css);
}
}

}

 

 

<div class="div_body topcss">

<div class="xuanfu">
<div id="source_container">
</div>
<div class="parent">
<div class="sui"><i class="fa fa-user-circle-o" aria-hidden="true"></i><input class="weui-btn_primary weui-input " type="button" value="我也来说两句" id="comment"></div>
</div>
</div>
<div class="container">
@*<div class="comentcss"><a href="#" id="more">查看更多</a></div>//这个功能去掉*@
</div>
</div>

转载于:https://www.cnblogs.com/DoudouZhang/p/10097949.html

你可能感兴趣的文章
一步步教你学会browserify
查看>>
Jmeter入门实例
查看>>
亲近用户—回归本质
查看>>
中文脏话识别的解决方案
查看>>
CSS之不常用但重要的样式总结
查看>>
Python编译错误总结
查看>>
URL编码与解码
查看>>
日常开发时遇到的一些坑(三)
查看>>
Eclipse 安装SVN插件
查看>>
深度学习
查看>>
TCP粘包问题及解决方案
查看>>
构建之法阅读笔记02
查看>>
添加按钮
查看>>
移动端页面开发适配 rem布局原理
查看>>
Ajax中文乱码问题解决方法(服务器端用servlet)
查看>>
会计电算化常考题目一
查看>>
阿里云服务器CentOS6.9安装Mysql
查看>>
剑指offer系列6:数值的整数次方
查看>>
js 过滤敏感词
查看>>
poj2752 Seek the Name, Seek the Fame
查看>>