var fScrollTopHeight = function(){
return document.documentElement&&document.documentElement.scrollTop || document.body && document.body.scrollTop || 0;
};
var fClientHeight = function(){
var clientHeight=0;
if(document.body.clientHeight&&document.documentElement.clientHeight){
clientHeight = (document.body.clientHeight<document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}else{
clientHeight = (document.body.clientHeight>document.documentElement.clientHeight)?document.body.clientHeight:document.documentElement.clientHeight;
}
return clientHeight;
};
var fBodyHeight = function(){
return Math.max(document.body.scrollHeight,document.documentElement.scrollHeight);
};
$(function(){
var fixedbar = document.getElementById("fixedbar");
// jScShow = $('<div style="position:fixed;bottom:100px;right:0;z-index:999;background:red;width:120px;height:100px;">5555</div>').appendTo('body');
$(document).on('scroll', function(){
// alert(1);
// jScShow.html([fScrollTopHeight(), fClientHeight(), fBodyHeight()].join('<BR /><BR />') + '<BR />');

// if(fScrollTopHeight()+fClientHeight()- fBodyHeight() >= -10){//最底部

// }

var items = $("#wrapper").find('.ui-coll-list');
var currentText = "";
items.each(function(){
var m = $(this);
if (fScrollTopHeight() > m.offset().top - 86) {
currentText = m.find('.head').text();
}else{
return false
}
});
if (currentText) {
fixedbar.innerHTML = currentText;
};

if (fScrollTopHeight() > 5) {
fixedbar.style.display="block";
}else{
fixedbar.style.display="none";
}
});
})

scroll的更多相关文章

  1. 【前端性能】高性能滚动 scroll 及页面渲染优化

    最近在研究页面渲染及web动画的性能问题,以及拜读<CSS SECRET>(CSS揭秘)这本大作. 本文主要想谈谈页面优化之滚动优化. 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的 ...

  2. MUI开发APP,scroll组件,运用到区域滚动

    最近在开发APP的过程中,遇到一个问题,就是内容有一个固定的头部和底部.         头部就是我们常用的header了,底部的话,就放置一个button,用来提交页面数据或者进入下一个页面等,效果 ...

  3. 完美解决,浏览器下拉显示网址问题 | 完美解决,使用原生 scroll 写下拉刷新

    在 web 开发过程中我们经常遇到,不想让用户下拉看到我的地址,也有时候在 div 中没有惯性滚动,就此也出了 iScroll 这种关于滚动条的框架,但是就为了一个体验去使用一个框架好像又不值得,今天 ...

  4. offset、client、scroll开头的属性归纳总结

    HTML元素有几个offset.client.scroll开头的属性,总是让人摸不着头脑.在书中看到记下来,分享给需要的小伙伴.主要是以下几个属性: 第一组:offsetWidth,offsetHei ...

  5. mui scroll和上拉加载/下拉刷新

    mui中 scroll和上拉加载/下拉刷新同时存在会出现两个滚动条 把/*   */ /* //mui页面鼠标拖动代码: mui('.mui-scroll-wrapper').scroll({ dec ...

  6. JavaScript学习笔记5 之 计时器 & scroll、offset、client系列属性 & 图片无缝滚动

    一.计时器 setInterval ( 函数/名称 , 毫秒数 )表示每经过一定的毫秒后,执行一次相应的函数(重复) setTimeout ( 函数/名称 , 毫秒数 ) 表示经过一定的毫秒后,只执行 ...

  7. JavaScript中的 offset, client,scroll

    在js 中我们要用到的 offset, client, scroll 在这我把自己理解的给大家分享一下. offset div.offsetTop 指div距离上方或上层控件的距离,单位像素 div. ...

  8. 【前端性能】高性能滚动 scroll 及页面渲染优化--转发

    本文主要想谈谈页面优化之滚动优化. 主要内容包括了为何需要优化滚动事件,滚动与页面渲染的关系,节流与防抖,pointer-events:none 优化滚动.因为本文涉及了很多很多基础,可以对照上面的知 ...

  9. 由overflow-x:scroll产生的收获

    我们都知道float:left属性会让元素向左浮动,如果用一个div将几个左浮动的li包起来,是不是div的宽度被li撑得很长很长呢,代码: <!DOCTYPE html> <htm ...

  10. UGUI 之Scroll Rect 坑

    由于UGUI没有提供类似Scroll View类似的控件,但提供了ScrollRect主机.可以自定义Scroll View 同时提供了Mask组件来遮罩超出Scroll Rect对象的范围, 之所以 ...

随机推荐

  1. android学习日记16--GridView(网格视图)

    一.GridView 1.简述 GridView按照行列来显示图片或文本的一种视图,排列其实有点类似TableLayout布局, 不过和TableLayout还是差别很大的,倒比较像二维的ListVi ...

  2. ADO.Net的小知识(连接数据库)二

    上次提到数据库连接有两种形式断开式连接和打开式连接,断开式连接我已经讲解了,下面我来给大家讲解一下打开式连接 (1)引入命名空间:using System.Data.SqlClient; 该语句用于导 ...

  3. TCP连接的建立与关闭

    TCP是主机对主机层的传输控制协议:建立连接要三个握手,断开连接要四次挥手. 位码即TCP标志位,有6种标示:SYN(synchronous建立联机),ACK(acknowledgement 确认), ...

  4. oracle数据库中,分天查询数目

    select to_CHAR(SP_MT_TIME,'DD'),count(*) from table2 group by to_CHAR(SP_MT_TIME,'DD');

  5. FastDFS为什么要结合Nginx

    FastDFS为什么要结合Nginx? 我们在使用FastDFS部署一个分布式文件系统的时候,通过FastDFS的客户端API来进行文件的上传.下载.删除等操作.同时通过FastDFS的HTTP服务器 ...

  6. iframe实现面页无刷新提交表单

    一.表单提交到了哪里? 这似乎是个无知的问题,我们都知道表单提交到服务器,java,php,asp等服务器,然后由服务器去读.那么之后呢,服务器总要返回点什么吧,要么返回 一个xml或json数据,要 ...

  7. Oracle报错:ORA-01747: user.table.column, table.column 或列说明无效

    1.检查sql书写正确性 2.如果sql书写正确,则是由于数据库列名起的不好引起的,名字用到了数据库的关键字. 如果列很多,又不好确定是哪个列名使用了关键字,以下建议可供参考: 我用以下方法定位 se ...

  8. JQuery 性能优化

    一.合适的选择器 JQuery 选择器提供丰富的选择器来定位DOM元素, 基本选择器 #id..class.element.*等:那他们哪个更高效呢? 第一选择: $("#id") ...

  9. php文件上传限制

    PHP默认的上传限定是最大2M,想上传超过此设定的文件,需要调整PHP.apache等的一些参数.下面,我们简要介绍一下PHP文件上传涉及到的一些参数: file_uploads :是否允许通过HTT ...

  10. C# 编写短信发送Window服务

    我们做项目过程中,一般都会有发送短信的需求.最常见的就是户注册或者登录时发送短信验证码.不同类型的短信发送,我们都可以放到到一张短信表中,然后通过一个定时的作业去执行短信发送.而定时作业的执行,我们就 ...