javascript 滑动底部加载事件

移动端底部导航栏之css滚动 移动端导航栏滚动之css <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0, user-scalable=no"> * { margin: 0; padding: 0; 阅读详情
// 自定义事件
	function ajax_function() {
	    //alert("自定义事件内容");
	    getMore();
	}

	var timeoutInt;   // 要保证最后要运行一次
	window.onscroll = function () {
	    setTimeout(function () {
	        if (timeoutInt != undefined) {
	            window.clearTimeout(timeoutInt);
	        }
	        timeoutInt = window.setTimeout(function () {
	            //监听事件内容
	            if(getScrollHeight() == getDocumentTop() + getWindowHeight()){
	                //当滚动条到底时,这里是触发内容
	                //异步请求数据,局部刷新dom
	                ajax_function()
	            }
	        }, 105);
	    }, 100);
	}

	//文档高度
	function getDocumentTop() {
	    var scrollTop =  0, bodyScrollTop = 0, documentScrollTop = 0;
	    if (document.body) {
	        bodyScrollTop = document.body.scrollTop;
	    }
	    if (document.documentElement) {
	        documentScrollTop = document.documentElement.scrollTop;
	    }
	    scrollTop = (bodyScrollTop - documentScrollTop > 0) ? bodyScrollTop : documentScrollTop;
	    console.log("scrollTop:"+scrollTop);
	    return scrollTop;
	}

	//可视窗口高度
	function getWindowHeight() {
	    var windowHeight = 0;
	    if (document.compatMode == "CSS1Compat") {
	        windowHeight = document.documentElement.clientHeight;
	    } else {
	        windowHeight = document.body.clientHeight;
	    }
	    console.log("windowHeight:"+windowHeight);
	    return windowHeight;
	}

	//滚动条滚动高度
	function getScrollHeight() {
	    var scrollHeight = 0, bodyScrollHeight = 0, documentScrollHeight = 0;
	    if (document.body) {
	        bodyScrollHeight = document.body.scrollHeight;
	    }
	    if (document.documentElement) {
	        documentScrollHeight = document.documentElement.scrollHeight;
	    }
	    scrollHeight = (bodyScrollHeight - documentScrollHeight > 0) ? bodyScrollHeight : documentScrollHeight;
	    console.log("scrollHeight:"+scrollHeight);
	    return scrollHeight;
	}

 

js实现滚轮滑动到底部自动加载(完整版) /let scrollHeight=document.querySelector("JL").scrollHeight //js中使用。// let innerHeight=document.querySelector("JL").clientHeight //js中使用。//let scrollTop=document.querySelector("JL").scrollTop //js中使用。//此时的data传递的就是正常查询需要的参数,以及分页的页码和数量。//判断是否还有数据。 阅读详情

相关推荐

傻白入门芯片设计,芯片键合(Die Bonding)(四)

傻白入门芯片设计,芯片键合(Die Bonding)(四) 引线键合、倒装芯片键合、管脚贴合技术

qq_46675545的博客 3万+

原生javascript移动端滚动到底部加载更多数据效果代码

CodingNoob 4147

H3C IPsec over GRE VPN 实验

配置 IPsec over GRE VPN 来连通两端内网

M建的博客 2463

移动端实现滑动到底部加载下一页

1、用于盛放信息流的容器 <ul> <!-- 底部标志,用于往底部标志之前添加 --> <li id="end-sign"></li> </ur> 2、 JavaScript部分 <script type='text/javascript'> // 默认当前起始页 var page = 1; ...

nhphp的博客 3142

VCS和UVM常用编译选项

VCS编译选项 -full64 在64bit模式下编译、仿真,用于64位操作系统 -j8 指定编译器可以并行编译的进程数为8 -timescale=1ns/1ps 指定仿真时间和精度 +libext+.v+.V+.sv+.svh 识别.v、.sv、.svh等多种格式文件 -sverilog 支持system verilog 编译 -f xxx.lisf 指定包含所有设计文件列表的文件名 -top test 设置顶层模块为test。(指包含.

qq_40571921的博客 9932

移动端网页滑动到底部触发事件

移动端网页滑动到底部触发事件

徐同保的专栏 6941

保姆级教程:用OpenCV和MediaPipe在Python里实现实时手势识别(附完整代码)

本文提供了一份详细的Python教程,教你如何使用OpenCV和MediaPipe实现实时手势识别系统。从环境配置、手部关键点检测到手势分类算法,逐步讲解如何构建高精度手势识别应用,适用于智能家居控制、PPT操作等场景。教程包含完整代码示例和性能优化技巧,特别适合计算机视觉初学者和开发者实践。

weixin_28677005的博客 327

解决ios移动端双击页面下移

ios移动端在双击弹出层的时候会出现页面下移,露出底层页面的现象 解决办法: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title></title> </head> <...

weixin_30783629的博客 528

3、深入了解响应式扩展(Reactive Extensions)

本文深入探讨了响应式扩展(Reactive Extensions,Rx)的起源、核心概念及其在客户端和服务器端的应用。从Volta项目谈起,解析了Rx如何解决事件传输问题,并介绍了可观察对象(IObservable)和观察者(IObserver)的设计与实现机制。文章还详细讲解了Rx操作符、弹珠图的使用、拉模型与推模型的对偶性原理,并通过代码示例展示了如何将枚举转换为可观察对象。最后总结了Rx的优势,并展望其在未来软件开发中的广泛应用前景。

m2n3b4v5c6的博客 113

Android 车联网——CarAudioService介绍(六)

CarAudioService 是 Android Automotive OS 中的一个重要组件,用于管理车辆中的音频功能。它是 Android Auto 的一部分,负责处理车辆音频的播放、控制和路由。CarAudioService 使用标准的 Android 组件架构,基于 Binder 通信机制,提供了一组 API,用于管理车辆音频。它包括以下主要功能:音频路由管理:CarAudioService 可以让开发者控制音频的路由,即将音频发送到不同的输出设备,例如车辆的扬声器、耳机等。

小旭的专栏 3201

js/jquery控制页面滑动到底部时自动加载事件

页面滚动动态加载数据,页面下拉自动加载内容 相信很多人都见过瀑布流图片布局,那些图片是动态加载出来的,效果很好,对服务器的压力相对来说也小了很多  有手机的相信都见过这样的效果:进入qq空间,向下拉动空间,到底部时,会动态加载剩余的说说或者是日志  今天我们就来看看他们的实现思路和js控制动态加载的代码 下面的代码主要是控制滚动条下拉时的加载事件的 在下面代码说明出,

yidianbiji的博客 548

【网络安全 | 渗透工具】密码字典生成工具crunch、cupp安装使用教程

Crunch是一个常用的密码破解工具,它可以根据指定的字符集、长度和模式生成各种可能的密码并进行暴力破解。同时,Crunch可以将生成的密码保存到文件中,以便在破解工具中使用。在进行渗透测试时,手动收集密码字典是十分耗时的,利用密码字典生成工具可以大幅缩短时间,提高爆破宽度。

等风来 8421

(VUE)JS判断滚动条滑动到底部加载更多数据,并防止事件多次触发

首先在mounted中添加滚动条scroll监视事件 mounted() { //监视scroll滚动条 window.addEventListener("scroll", this.isRefresh, true); }, 在isRefresh函数中,当第一次到达底部时我们将isRefreshBool变量变为false(禁止refresh()加载数据函数多次触发),当我们的refresh()函数中请求完成后再将isRefreshBool设为true(允许到达底部执行refr.

weixin_43736435的博客 2872

精雕软件(JDpaint) 5.5 绿色版

精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版精雕软件(JDpaint) 5.5 绿色版

Probability and Statistics - 4th edition

Probability and Statistics - 4th edition

js监听scrolltop_js监听页面的scroll事件,当移到底部时触发事件

//页面拉到底时自动加载更多$(window).scroll(function(event){var wScrollY = window.scrollY; // 当前滚动条位置var wInnerH = window.innerHeight; // 设备窗口的高度(不会变)var bScrollH = document.body.scrollHeight; // 滚动条总高度if (wScroll...

weixin_42723849的博客 206

深度学习工具包 DeepLearningToolbox

深度学习工具包Deprecation notice.-----This toolbox is outdated and no longer maintained.There are much better tools available for deep learning than this toolbox, e.g. [Theano](http://deeplearning.net/software/theano/), [torch](http://torch.ch/) or [tensorflow](http://www.tensorflow.org/)I would suggest you use one of the tools mentioned above rather than use this toolbox.Best, Rasmus.DeepLearnToolbox================A Matlab toolbox for Deep Learning.Deep Learning is a new subfield of machine learning that focuses on learning deep hierarchical models of data.It is inspired by the human brain's apparent deep (layered, hierarchical) architecture.A good overview of the theory of Deep Learning theory is[Learning Deep Architectures for AI](http://www.iro.umontreal.ca/~bengioy/papers/ftml_book.pdf)For a more informal introduction, see the following videos by Geoffrey Hinton and Andrew Ng.* [The Next Generation of Neural Networks](http://www.youtube.com/watch?v=AyzOUbkUf3M) (Hinton, 2007)* [Recent Developments in Deep Learning](http://www.youtube.com/watch?v=VdIURAu1-aU) (Hinton, 2010)* [Unsupervised Feature Learning and Deep Learning](http://www.youtube.com/watch?v=ZmNOAtZIgIk) (Ng, 2011)If you use this toolbox in your research please cite [Prediction as a candidate for learning deep hierarchical models of data](http://www2.imm.dtu.dk/pubdb/views/publication_details.php?id=6284)```@MASTERSTHESIS\{IMM2012-06284, author = "R. B. Palm", title = "Prediction as a candidate for learning deep hierarchical models of data", year = "2012",}```Contact: rasmusbergpalm at gmail dot comDirectories included in the toolbox-----------------------------------`NN/` - A library for Feedforward Backpropagation Neural Networks`CNN/` - A library for Convolutional Neural Networks`DBN/` - A library for Deep Belief Networks`SAE/` - A library for Stacked Auto-Encoders`CAE/` - A library for Convolutional Auto-Encoders`util/` - Utility functions used by the libraries`data/` - Data used by the examples`tests/` - unit tests to verify toolbox is workingFor references on each library check REFS.mdSetup-----1. Download.2. addpath(genpath('DeepLearnToolbox'));Example: Deep Belief Network---------------------```matlabfunction test_example_DBNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit RBM and visualize its weightsrand('state',0)dbn.sizes = [100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);figure; visualize(dbn.rbm{1}.W'); % Visualize the RBM weights%% ex2 train a 100-100 hidden unit DBN and use its weights to initialize a NNrand('state',0)%train dbndbn.sizes = [100 100];opts.numepochs = 1;opts.batchsize = 100;opts.momentum = 0;opts.alpha = 1;dbn = dbnsetup(dbn, train_x, opts);dbn = dbntrain(dbn, train_x, opts);%unfold dbn to nnnn = dbnunfoldtonn(dbn, 10);nn.activation_function = 'sigm';%train nnopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.10, 'Too big error');```Example: Stacked Auto-Encoders---------------------```matlabfunction test_example_SAEload mnist_uint8;train_x = double(train_x)/255;test_x = double(test_x)/255;train_y = double(train_y);test_y = double(test_y);%% ex1 train a 100 hidden unit SDAE and use it to initialize a FFNN% Setup and train a stacked denoising autoencoder (SDAE)rand('state',0)sae = saesetup([784 100]);sae.ae{1}.activation_function = 'sigm';sae.ae{1}.learningRate = 1;sae.ae{1}.inputZeroMaskedFraction = 0.5;opts.numepochs = 1;opts.batchsize = 100;sae = saetrain(sae, train_x, opts);visualize(sae.ae{1}.W{1}(:,2:end)')% Use the SDAE to initialize a FFNNnn = nnsetup([784 100 10]);nn.activation_function = 'sigm';nn.learningRate = 1;nn.W{1} = sae.ae{1}.W{1};% Train the FFNNopts.numepochs = 1;opts.batchsize = 100;nn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.16, 'Too big error');```Example: Convolutional Neural Nets---------------------```matlabfunction test_example_CNNload mnist_uint8;train_x = double(reshape(train_x',28,28,60000))/255;test_x = double(reshape(test_x',28,28,10000))/255;train_y = double(train_y');test_y = double(test_y');%% ex1 Train a 6c-2s-12c-2s Convolutional neural network %will run 1 epoch in about 200 second and get around 11% error. %With 100 epochs you'll get around 1.2% errorrand('state',0)cnn.layers = { struct('type', 'i') %input layer struct('type', 'c', 'outputmaps', 6, 'kernelsize', 5) %convolution layer struct('type', 's', 'scale', 2) %sub sampling layer struct('type', 'c', 'outputmaps', 12, 'kernelsize', 5) %convolution layer struct('type', 's', 'scale', 2) %subsampling layer};cnn = cnnsetup(cnn, train_x, train_y);opts.alpha = 1;opts.batchsize = 50;opts.numepochs = 1;cnn = cnntrain(cnn, train_x, train_y, opts);[er, bad] = cnntest(cnn, test_x, test_y);%plot mean squared errorfigure; plot(cnn.rL);assert(er<0.12, 'Too big error');```Example: Neural Networks---------------------```matlabfunction test_example_NNload mnist_uint8;train_x = double(train_x) / 255;test_x = double(test_x) / 255;train_y = double(train_y);test_y = double(test_y);% normalize[train_x, mu, sigma] = zscore(train_x);test_x = normalize(test_x, mu, sigma);%% ex1 vanilla neural netrand('state',0)nn = nnsetup([784 100 10]);opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samples[nn, L] = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.08, 'Too big error');%% ex2 neural net with L2 weight decayrand('state',0)nn = nnsetup([784 100 10]);nn.weightPenaltyL2 = 1e-4; % L2 weight decayopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex3 neural net with dropoutrand('state',0)nn = nnsetup([784 100 10]);nn.dropoutFraction = 0.5; % Dropout fraction opts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex4 neural net with sigmoid activation functionrand('state',0)nn = nnsetup([784 100 10]);nn.activation_function = 'sigm'; % Sigmoid activation functionnn.learningRate = 1; % Sigm require a lower learning rateopts.numepochs = 1; % Number of full sweeps through dataopts.batchsize = 100; % Take a mean gradient step over this many samplesnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex5 plotting functionalityrand('state',0)nn = nnsetup([784 20 10]);opts.numepochs = 5; % Number of full sweeps through datann.output = 'softmax'; % use softmax outputopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, train_x, train_y, opts);[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');%% ex6 neural net with sigmoid activation and plotting of validation and training error% split training data into training and validation datavx = train_x(1:10000,:);tx = train_x(10001:end,:);vy = train_y(1:10000,:);ty = train_y(10001:end,:);rand('state',0)nn = nnsetup([784 20 10]); nn.output = 'softmax'; % use softmax outputopts.numepochs = 5; % Number of full sweeps through dataopts.batchsize = 1000; % Take a mean gradient step over this many samplesopts.plot = 1; % enable plottingnn = nntrain(nn, tx, ty, opts, vx, vy); % nntrain takes validation set as last two arguments (optionally)[er, bad] = nntest(nn, test_x, test_y);assert(er < 0.1, 'Too big error');```[![Bitdeli Badge](https://d2weczhvl823v0.cloudfront.net/rasmusbergpalm/deeplearntoolbox/trend.png)](https://bitdeli.com/free "Bitdeli Badge")

说一下php的自动加载,phpcms实现向下滑动后自动加载效果

本文简单介绍了使用phpcms制作的页面列表中如何实现向下滑动加载更多的效果.首先在phpcms更目录api文件夹中,新建一个名为zdload.php的空白文件这里以调用文章模型列表为例,在文件中加入如下代码作为服务端:defined('IN_PHPCMS') or exit('No permission resources.');$db = '';$db = pc_base::load_mode...

weixin_39600366的博客 303

LinePhone3.2.7(android端最新版本) sip客户端

SIP客户端For android:LinePhone3.2.7(最新版本),官网地址:http://www.linphone.org/

屏幕到达页面底部刷新页面——vue

e为默认属性值,其中,e.target.scrollHeight为页面的整体高度,e.target.clientHeight为当前屏幕的高度,e.target.scrollTop为屏幕顶部与页面顶部的距离。只有属性和事件给最外层,以上三个属性才能代表以上三个含义,当等式成立的时候,触发刷新事件就可以了。屏幕有一个高度,页面也有一个高度,当我们向下滑动屏幕时,屏幕的顶部与页面的顶部直接便产生了距离。所以屏幕高度+屏幕顶部与页面顶部的距离

zhangnx10000的博客 1144

下滑加载更多js_vue.js怎么实现滑动到底部加载更多数据效果?

vue.js怎么实现滑动到底部加载更多数据效果?下面本篇文章给大家简单介绍一下vue实现滑动到底部加载更多效果。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。本文实例为大家分享了vue实现滑动到底部加载更多的具体代码,供大家参考,具体内容如下思路:如果可视区的高度域dom元素的getBoundingClientRect().bottom高度相同说明已经到了底部,可以实现加载了te...

weixin_39907133的博客 539

js滑动到底部加载更多

//滚动条到页面底部加载更多案例 $(window).scroll(function(){ var scrollTop = $(this).scrollTop(); //滚动条距离顶部的高度 var scrollHeight = $(document).height(); //当前页面的总高度 var clientHeight = $(this).height(); /

Carlos__z的专栏 2万+

js禁止苹果页面底部滚动_JS 原生JS 判断滚动条滑动到底部(兼容苹果safari)

ListenerScoller () {var pageIndex = 1;var startX, startY;document.addEventListener(‘touchstart‘,function (ev) {startX = ev.touches[0].pageX;startY = ev.touches[0].pageY;}, false);let _this = this;docu...

weixin_35687240的博客 297

Html5滑动事件,用于滑动分页

当滑过的文档高度 + 当前浏览器高度 = 文档的高度 即判断滑到底部,用于Html5分页

Badboy66的博客 1759

判断手机滑动到顶部和顶部的js.

$(function () { $(window).scroll(function () { var documentTop = $(document).scrollTop(); var windowHeight = $(window).height(); var document

kakaxiD的博客 2891
上一篇: windows 杀死进程的三个步骤
下一篇: javascript 时间戳转成时间格式
knife1220
博客等级 码龄15年 33粉丝 176原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付:10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值