jQuery scroll(滚动)延迟加载
延迟加载
- $(window).scroll(function(){
- var scrollHeight = $(document).height(); //文档高度
- var scrollTop = $(this).scrollTop(); //滚动条卷去高度
- var windowHeight = $(this).height(); // 窗口高度
- // console.log(scrollHeight, scrollTop, windowHeight)
- if(scrollHeight - scrollTop - windowHeight < 100 ){
- console.log("到底了");
- //ajax渲染页面
- }
- });
- jQuery(function($){
- var topicBoxTopHeight = jQuery('#topicBox').offset().top;
- var topicBoxTopHeight_show = 1
- $(window).scroll(function(event){
- if($(this).scrollTop() > topicBoxTopHeight-$(window).height()-200 && topicBoxTopHeight_show==1){
- topicBoxTopHeight_show=0;
- topicBoxFn();
- }
- });
- })
jQuery scroll(滚动)延迟加载的更多相关文章
- jquery 文字滚动大全 scroll 支持文字或图片 单行滚动 多行滚动 带按钮控制滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jQuery scroll事件实现监控滚动条分页示例(转)
这篇文章主要介绍了jQuery scroll事件实现监控滚动条分页简单示例,使用ajax加载,同时介绍了(document).height()与$(window).height()的区别,需要的朋友可 ...
- jQuery页面滚动监听事件及高级效果插件
jQuery页面滚动监听事件及高级效果插件 1. One Page scroll (只适用于上下焦点图)http://www.thepetedesign.com/demos/onepage_scrol ...
- 基于JQuery实现滚动到页面底端时自动加载更多信息
基于JQuery实现滚动到页面底端时自动加载更多信息 关键代码: 代码如下: var stop=true; $(window).scroll(function(){ totalheight = par ...
- jquery 单行滚动、批量多行滚动、文字图片翻屏滚动效果代码
jquery单行滚动.批量多行滚动.文字图片翻屏滚动效果代码,需要的朋友可以参考下. 以下代码,运行后,需要刷新下,才能加载jquery,要不然看不到效果.一.单行滚动效果 <!DOCTYPE ...
- 【学习】滚动延迟加载插件scrollLoading用法
今天遇到一个很好用的滚动延迟加载的插件,作者是我的偶象大神张鑫旭,其博客为http://www.zhangxinxu.com/. 以前也写过这种效果,用的是lazyload,不过只能实现图片的加载.而 ...
- ios中iframe的scroll滚动事件替代方法
在公众号的开发中,遇到ios中iframe的scroll滚动事件失效,在此做下记录. 因为接口获取的数据必须放在iframe中展示,滚动到底部按钮变亮,如图: 代码如下: <!DOCTYPE h ...
- jquery ajax 滚动加载数据
jquery php 滚动加载数据(文件包 rollingpage) 效果如下: 页面加载时候($function(){ 自动加载第一页数据 }) 设置: var winH = $(window).h ...
- jQuery的滚动监听
jQuery的滚动监听 1.当前滚动的地方的窗口顶端到整个页面顶端的距离: var winPos = $(window).scrollTop(); 2.获取指定元素的页面位置: $(val).offs ...
- jquery页面滚动显示浮动菜单栏锚点定位效果
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
随机推荐
- WORD神操作!第一个技巧你就傻眼了!
原文:http://mp.weixin.qq.com/s?__biz=MzA4NzkyMDIwNw==&mid=220128483&idx=4&sn=cfa87c941f36f ...
- linux的rpm命令
rpm 执行安装包二进制包(Binary)以及源代码包(Source)两种.二进制包可以直接安装在计算机中,而源代码包将会由 RPM自动编译.安装.源代码包经常以src.rpm作为后缀名. 常用命令组 ...
- UITableView优化技巧
UITableView的简单认识 UITableView最核心的思想就是UITableViewCell的重用机制.简单的理解就是:UITableView只会创建一屏幕(或一屏幕多一点)的UITable ...
- nginx.conf配置及优化相关
nginx.conf配置文件内容 user www www; worker_processes ; worker_rlimit_nofile ; error_log /data/nginx/logs/ ...
- PHP -- four arithmetic operation
PHP 生成 简单四则运算. Thanks for Open Source. 本代码基于 jiaych php四则运算计算函数实现. <?php /*基于jiaych php四则运算计算函数 h ...
- linux 主机免验证登录
1.ssh-keygen -t [rsa|dsa],将会生成密钥文件和私钥文件 id_rsa,id_rsa.pub或id_dsa,id_dsa.pub 2.scp -p port ~/.ssh/id ...
- [转]Web性能监控自动化探索之路–初识WebPageTest
本文转自:http://www.webryan.net/2013/01/use-webpagetest-to-analyze-web-performance/ 无论是从Velocity 2012还是在 ...
- css3 多列布局记
css3 多列布局 多列布局属性: columns:column-widht和column-count的缩写. column-width:定义每列列宽度. column-count:定义分列列数. c ...
- css3 过渡记
CSS3 过渡 CSS3的transition允许CSS的属性值在一定的时间区间内平滑地过渡.这种效果可以在鼠标单击,获得焦点,被点击或对元素任何改变中触发,并平滑地以动画效果改变CSS的属性值. t ...
- 再次阅读《精通CSS-高级Web标准解决方案(第二版)》
昨天(2015年11月21日) 在我们学校举行了大型招聘会.我面试了三家企业.有一家企业是先做笔试题的,做完后发现自己还是很多细节处理得不够.无论还有没有二面,我还是要重新把<精通CSS> ...