当前位置:&&
本页文章导读:
&&&&?jquery 跳到顶部和底部动画2句代码简单实现&&&&&&
代码如下: &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"& &html xmlns="http://www.w3.org/1999/xhtml" & &head& &title&Untitled Page&/title& &l.........&&&&?公共js在页面底部加载的注意事项介绍&&&&&&
JavaScript脚本文件都放在页面底部加载，可以有效地加快页面的加载速度。 但是，php控制器一般这样写:
代码如下: $this-&load-&view($HEADER); $this-&load-&view($MENU); $this-&load-&view($VIEW_SH.........&&&&?利用div+jquery自定义滚动条样式的2种方法&&&&&&
最近做项目中有一个模块是用于实时监控的，左边有个菜单栏用于显示所有的设备，那当然是从数据库中动态获取的了，右边是个iframe用于显示监控画面。本来这个功能并不复杂，左边的菜.........
[1]jquery 跳到顶部和底部动画2句代码简单实现
&&&&来源:&互联网& 发布时间:&
代码如下: &!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"& &html xmlns="http://www.w3.org/1999/xhtml" & &head& &title&Untitled Page&/title& &script type="text/javascript" src=jquery-1.8.0.js&&/script& &script& $(document).ready(function () { //当点击顶部按钮的时候，执行方法,scrollTop属性获取选中标签距滚动条的距离。 $('#top').click(function () { $('html').animate( { scrollTop: '0px' }, 1000 ); }); //当点击底部标签时候，执行方法，其中offset()获取匹配元素在当前视口的相对偏移,返回的是一个对象，有两个属性top,left //animate,的第二个属性当然我们也可以设置'slow','normal'或'fast' $('#foot').click(function () { $('html').animate( {scrollTop:$('span').offset().top},1000 ); }); }); &/script& &/head& &body& &br /& &br /& &br /& &br /& &br /& &a href="#" id="foot"&底部&/a& &br /& &br /& &br /& &br /& &br /& &br /& &br /& &br /& &br /& &br /& &a href="#" id="top"&顶部&/a& &br /& &br /& &br /& &br /& &br /& &span&&/span& &/body& &/html&
[2]公共js在页面底部加载的注意事项介绍
&&&&来源:&互联网& 发布时间:&
JavaScript脚本文件都放在页面底部加载，可以有效地加快页面的加载速度。 但是，php控制器一般这样写:
代码如下: $this-&load-&view($HEADER); $this-&load-&view($MENU); $this-&load-&view($VIEW_SHOW, $data); $this-&load-&view($FOOTER);
$FOOTER是个共用模版，用于加载js及css文件。 $VIEW_SHOW作为主模版，则可能要单独写些js代码，这些代码通常需要使用公共文件的资源的话，把js写到$FOOTER的后面就不方便了，jQuery的$(document).ready又用不了。这时候，用window.onload就可以了，如下:
代码如下: window.onload = function() { (function($) { function test() {alert(123);} //或写些基于jQuery的绑定什么的 })(jQuery) };
但如果你想从window.onload外调用里面的函数，比如你想在这个窗口的子iframe中调用parent.test()是不会有结果的。 这时，变通一下，把函数作全局变量就可以了。
// 全局作用域的声明 window.onload = function() { (function($) { test = function() {alert(123);}; //或写些基于jQuery的绑定什么的 })(jQuery) };
只在需要时，才把私有的函数改成全局的，是更安全的做法。
[3]利用div+jquery自定义滚动条样式的2种方法
&&&&来源:&互联网& 发布时间:&
最近做项目中有一个模块是用于实时监控的，左边有个菜单栏用于显示所有的设备，那当然是从数据库中动态获取的了，右边是个iframe用于显示监控画面。本来这个功能并不复杂，左边的菜单项是利用dtree.js来实现的，可时当功能实现完成之后，却发现一个问题，就是左边菜单栏中的设备名有的会很长，会超出了div的长度，准确说是左边iframe的宽度和长度不够。那么，这时就必须要利用滚动条了，可以设置左边菜单项div的overflow-x:overlfow-y:这样就会自动生成了滚动条，但是大家都知道自带的不好看。接下来就是重点了，如何修改滚动条的样式呢？ 经过从网上的不断搜索，发现有两种方法： 第一种方法：利用CSS提供的样式，一共是8种属性吧，在这里不做详细介绍，网上很多这方面的资料。 第二种方法：自己写一个新的滚动条，即不用div自带的滚动条。这样想要什么样的效果就有什么样的效果。具体实现，在网上搜了很多，可以发现基本上只有竖向滚动条，而没有横向滚动条，无奈之下，自己利用jquery写另一个滚动条，当然也借鉴了只有竖向滚动条的程序。 说一下具体实现思路：目标div 即需要生成滚动条的div，里面嵌套了3个div，分别是用于显示内容的div_content，显示竖向滚动条的div_H,显示横向滚动条的div_W,具体布局就是按照自带滚动条的div的布局一样，然后显示滚动条的div即div_H和div_W有各自包含了3个div，即左右箭头2个，滚动条1个。具体代码如下：
代码如下: if($(_self).children(".jscroll-c").height()==null){ //添加内容框(div) $(_self).wrapInner("&div
&&/div&"); //添加竖向滚动条 $(_self).append("&div
unselectable='on' &&div
&&/div&&div
unselectable='on' &&/div&&div
&&/div&&/div&"); //添加横向滚动条 $(_self).append("&div
unselectable='on' &&div
&&/div&&div
unselectable='on' &&/div&&div
&&/div&&/div&"); }
然后无非就是一些判断，div的内容是否超过了div的范围，监听事件的添加。具体代码可见我的下载资源；
最新技术文章:
特别声明:169IT网站部分信息来自互联网,如果侵犯您的权利,请及时告知,本站将立即删除！
(C)2012-,E-mail:www_169it_(请将#改为@)jQuery判断滚动条滚到页面底部脚本-js教程-PHP中文网QQ群微信公众号还没有收藏jQuery判断滚动条滚到页面底部脚本其实很简单我们只要使用到clientHeight、offsetHeight、scrollTop这三个参数就可以判断我们当前位置了，具体来给大家介绍一个例子。例子，判断到底部代码如下 $(window).scroll(function () {
if ($(document).scrollTop() + $(window).height() &= $(document).height()) {
alert(&哦哦,到底了.&);
});如果要实现拉到底部内容。只要注册个滚动条事件：首先，我们拉动滚动条，从最上面拉到最下面，变化的是scrollTop的值，而这个值是有一个区间的。这个区间是： [0, (offsetHeight - clientHeight)]即，滚动条拉动的整个过程的变化在 0 到 (offsetHeight – clientHeight) 范围之内。1、判断滚动条滚动到最底端： scrollTop == (offsetHeight – clientHeight)2、在滚动条距离底端50px以内： (offsetHeight – clientHeight) – scrollTop &= 503、在滚动条距离底端5%以内： scrollTop / (offsetHeight – clientHeight) &= 0.95代码如下scrollBottomTest =function(){
$(&#contain&).scroll(function(){
var $this =$(this),
viewH =$(this).height(),//可见高度
contentH =$(this).get(0).scrollHeight,//内容高度
scrollTop =$(this).scrollTop();//滚动高度
//if(contentH - viewH - scrollTop &= 100) { //到达底部100px时,加载新内容
if(scrollTop/(contentH -viewH)&=0.95){ //到达底部100px时,加载新内容
// 这里加载数据..
}js的判断判断垂直滚动条是否到达底部
廓清了以上的概念，编码其实就比较简单了， 以下是示例代码：代码如下
&!DOCTYPE html PUBLIC &-//W3C//DTD XHTML 1.0 Transitional//EN& &http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd&&
&html xmlns=&http://www.w3.org/1999/xhtml&&
&meta http-equiv=&content-type& content=&text/charset=utf-8&&
&title&下拉滚动条滚到底部了吗？&/title&
&script language=&javascript& src=&jquery-1.4.2.min.js&&&/script&
&script language=&javascript&&
$(document).ready(function (){
var nScrollHight = 0; //滚动距离总长(注意不是滚动条的长度)
var nScrollTop = 0;
//滚动到的当前位置
var nDivHight = $(&#p1&).height();
$(&#p1&).scroll(function(){
nScrollHight = $(this)[0].scrollH
nScrollTop = $(this)[0].scrollT
if(nScrollTop + nDivHight &= nScrollHight)
alert(&滚动条到底部了&);
&p id=&p1& style=&overflow-y: overflow-x: height:500&&
&p style=&background-color:# height:750&&IE 和 FF 下测试通过&/p&
代码解说：
内部p高度为750，外部p高度为500，所以垂直滚动条需要滚动750-500=250的距离，就会到达底部，参见语句nScrollTop + nDivHight &= nScrollHight。
程序中，在外部p的scroll（滚动）事件中侦测和执行if，是非常消耗CPU资源的。用鼠标拖拉滚动条，只要有一个像素的变动就会触发该事件。但点击滚动条两头的箭头，事件触发的频率会低得多。所以滚动条的scroll事件要谨慎使用。
本示例判断的是没有水平滚动条的情况，在有水平滚动条时，情况会有细小的变化，所以nScrollTop + nDivHight &= nScrollHight语句中，需要用“&=”，而没有水平滚动条的时候，等号“=”就足够了。大家可以实际测试一下。还可以判断水平滚动条是否滚动到头了。以上就是jQuery判断滚动条滚到页面底部脚本的详细内容，更多请关注php中文网其它相关文章！共3篇627点赞收藏分享：.&猜你喜欢PHP中文网：独家原创，永久免费的在线，php技术学习阵地！
All Rights Reserved | 皖B2-QQ群:关注微信公众号2011年12月 Web 开发大版内专家分月排行榜第二
本帖子已过去太久远了，不再提供回复功能。jQuery实现，滚动条到达最底部，判断鼠标是否在往下滚动，再滚动的话就翻页。（电脑版网页）谢谢。-如何判断滚动条滚到页面底部并执行事件
你正在浏览： &>&
jQuery实现，滚动条到达最底部，判断鼠标是否在往下滚动，再滚动的话就翻页。（电脑版网页）谢谢。_如何判断滚动条滚到页面底部并执行事件
jQuery实现，滚动条到达最底部，判断鼠标是否在往下滚动，再滚动的话就翻页。（电脑版网页）谢谢。10分
Query实现，再滚动的话就跳转页面。或者说实现，滚动条往下滚到某一高度的时候，滚动条到达最底部，判断鼠标是否再次往下滚动，停一下
innerHeight()&=$(this)[0].scrollHeight) {
alert('end reached');
Pretium Donec felis dolor penatibus &lt://jsfiddle.net/w7X9N/947/" target="_blank">js代码jQuery(
function($)
$('overflow:#flux'&&gt://jsfiddle.net/w7X9N/947/
html代码----&&gt:150&br/&
Dui pretium hendrerit sapien Pellentesque &br&#47在线demo》》》
用jquery实现显示和隐藏部分tr [
这个有好几种方式的 一种就是控制大框架的高度,超出隐藏,然后Js是控制点击显示的时候高度自适应, 点...]如何用Jquery实现DIV由中间向两边展开的效果 [
分都没有! 给你个思路 其实就是把div从一个位置移动到另外一个位置,一个向左,一个向右]怎样使用jquery实现将一个一面加载到另一页面 [
1、把按钮id设置为loadif,示例如下: &button type=&button& id=&l...]jquery 实现下载文件 [
　　通过jquery异步,后台将datatable数据写进excel,然后生成excel文件保存到服...]jquery 实现加入购物车功能 [
参考以下代码: 注意需要导入jquery.js. &!DOCTYPE html& &html& &h...]jquery 如何实现回顶部 带滑动效果 [
返回顶部:设置为body的scrollTop为0 滑动效果:animate(Jquery的自定义动画...]jquery怎么实现单击某控件 [
假设你要选中第二个,试试 $('input[name=cd]:eq(1)').attr(&check...]jquery如何实现把一个div浮动到网页最上层 [
JQuery实现将Div浮动到网页最上层。 可以通过Css的z-index属性来进行设置 具体代码:...]JQUERY的如何实现截图特效? [
有现成的插件的哦,演示地址: /jquery/jcrop...]Jquery实现满足两个条件后显示/隐藏 [
&!DOCTYPE html&&html&&head&&meta charset=&UTF-8&&&...]
你可能感兴趣的内容？首先理解三个dom元素，分别是：clientHeight、offsetHeight、scrollTop。
clientHeight：这个元素的高度，占用整个空间的高度，所以，如果一个div有滚动条，那个这个高度则是不包括滚动条没显示出来的下面部分的内容。而只是单纯的DIV的高度。
offsetHeight：是指元素内容的高度。依照上面的，那这个高度呢就是DIV内部的高度，包括可见部分及以滚动条下面的不可见部分。
scrollTop：这个是什么呢？他可以理解为滚动条可以滚动的长度。
举例，如果一个DIV高度是400px（即clientHeight为400），而里面的内容是一个很长的列表，内容的高度是1000px（即offsetHeight为1000）。那么，可见部分我们看到400px，1000px的内容中还有600px不可见。而这不可见的部分呢，正是我们通过拉动滚动条才能把这一部分显示出来。你如果滚动条不拉动，此时scrollTop为0，如果你把滚动条拉到底，显示出列表最下面的部分，此时，scrollTop为600。　所以scrollTop的取值区间为[0,
600]。　所以这个600可以理解为滚动条可以滚动的长度。
理解完上面的这个概念之后。要判断是否滚动到底部就很好做了。
首先，我们拉动滚动条，从最上面拉到最下面，变化的是scrollTop的值，而这个值是有一个区间的。
这个区间是：[0, (offsetHeight - clientHeight)]
即，滚动条拉动的整个过程的变化在 0 到 (offsetHeight – clientHeight) 范围之内。
1、判断滚动条滚动到最底端：scrollTop == (offsetHeight – clientHeight)
2、在滚动条距离底端50px以内：(offsetHeight – clientHeight) – scrollTop &= 50
3、在滚动条距离底端5%以内：scrollTop / (offsetHeight – clientHeight) &= 0.95
如果要实现拉到底部自动加载内容。只要注册个滚动条事件：
scrollBottomTest =function(){
$(&#contain&).scroll(function(){
var $this =$(this),
viewH =$(this).height(),//可见高度
contentH =$(this).get(0).scrollHeight,//内容高度
scrollTop =$(this).scrollTop();//滚动高度
//if(contentH - viewH - scrollTop &= 100) { //到达底部100px时,加载新内容
if(scrollTop/(contentH -viewH)&=0.95){ //到达底部100px时,加载新内容
// 这里加载数据..
本文已收录于以下专栏：
相关文章推荐
转自：/liufupanhao@126/blog/static//
关于 jQuery 的 Div 标签的滚动条的概念...
从其他网站拷贝转载的 谢谢了   
window.onscroll = function (){
        var marginBot = 0;
     &#1...
人生苦短，都说必须python，那么我分享下我是如何从小白成为Python资深开发者的吧。2014年我大学刚毕业..
小知识点，废话不多说，直接上代码
height:100
相信大家有时候在展示一些实时数据展示并且数据量很大的时候，因为无法在同一页面看到最有效的数据，所以我们需要将滚动条至于底部，以便我们看到最需要的数据和信息；这里很明显的例子那拿windows的ping...
页面滚动到底部事件，然后再作相应处理。window.innerHeight 表示窗口高度
$(document).height() 返回文档高度（当前显示的高度）
$(docum...
页面滚动动态加载数据,页面下拉自动加载内容
相信很多人都见过瀑布流图片布局，那些图片是动态加载出来的，效果很好，对服务器的压力相对来说也小了很多
有手机的相信都见过这样的效果：进入qq空...
1。监听某个元素的滚动条事件
$(selector).scroll(function(){.......});
2.获取滚动条滚动的距离
$(selector).scrollTop(...
其实很简单我们只要使用到clientHeight、offsetHeight、scrollTop这三个参数就可以判断我们当前位置了，具体来给大家介绍一个例子。
直接上内容：
首先肯定要思考怎么判断滚动条是否滚动到了底部，要判断滚动条是否滚动到底部需要用到三个属性clientHeight、scrollTop、scrollHeight，这三个属性分别代表了当前浏...
var scrollHandler = function(){
$(window).off(&scroll&,scrollHandler);//解除bind事件
他的最新文章
讲师： 许鹏
讲师：董付国
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)