Jquery html页面处理基础
1、怎样获得浏览器的可视高度?
|
var windHight = $(window).height(); //获得浏览器的可视高度 |
2、怎样获得滚动条相对于顶部的高度?
|
var scrollHight = $(window).scrollTop(); //获得滚动条相对于顶部的高度 |
3、怎样获得每张图片相对于浏览器顶部的高度?
|
var imgHight = $( 'img' ).offset().top; //获得每张图片相对于顶部的高度 |
4、怎样判断图片出现在了浏览器的可视窗口内部?
|
imgHight - windHight < scrollHight ? '成立的话就代表出现了' : '不成立就代表没出现' ; |
5、怎样排除首屏的图片?
|
imgHight - windHight > 0 //排除首屏的图片 |
6、排除已经加载过的图片
|
$( this ).attr( 'src' ) != $( this ).data( 'url' ) //排除已经加载过的图片 |
Jquery html页面处理基础的更多相关文章
- JQuery 实现页面无刷新
对于JQuery实现页面无刷新的效果,即:应用这个JQuery这个组件,可以实现在页面上加载数据库中的数据信息,但是并没有给用户页面刷新的感觉,这样既可以有效的进行数据交互,也可以不妨碍用户的其他操作 ...
- jQuery:自学笔记(1)——基础入门
jQuery:自学笔记(1)——基础入门 认识JQuery 1.jQuery概述 jQuery是一个快速.小巧 .功能丰富的JavaScript函数库.它可以实现“写的少,做的多”的目标. jQuer ...
- 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变
查看本章节 查看作业目录 需求说明: 利用 jQuery 操作页面元素的方法,实现电商网站购物车页面商品数量的增加和减少操作,要求单项价格和总价随着数量的改变而改变 当用户单击"+" ...
- jQuery实现页面内锚点平滑跳转
平时我们做导航滚动到内容都是通过锚点来做,刷的一下就直接跳到内容了,没有一丝的滚动效果,而且 url 链接最后会有“小尾巴”,就像#keleyi,今天我就介绍一款 jquery 做的滚动的特效,既可以 ...
- jquery简单笔记(1) - 基础记录
一.dom对象及jquery对象相互转换 jquery对象转换成dom对象,即 [index] 和 get(index) 第一种方式: var $j = $('#id'); // jquery对象 v ...
- js 和 jquery 获取页面和滚动条的高度 视口高度文档高度
js 和 jquery 获取页面和滚动条的高度 //页面位置及窗口大小 function GetPageSize() { var scrW, scrH; if(window.innerHeight & ...
- 关于jquery计算页面元素数量
这段jquery计算页面元素数量代码,能不能刷新页面直接输出数量,而不用点计算按钮 <scriptsrc="http://ajax.googleapis.com/ajax/libs/j ...
- 用JS或jQuery访问页面内的iframe,兼容IE/FF
用JS或jQuery访问页面内的iframe,兼容IE/FF js或者jQuery访问页面中的框架也就是iframe.注意:框架内的页面是不能跨域的! 假设有两个页面,在相同域下. index.htm ...
- 通过javascript库JQuery实现页面跳转功能代码
通过javascript库JQuery实现页面跳转功能代码的四段代码实例如下. 实例1: 1 2 3 4 $(function(){ var pn = $("#gotopagenum&quo ...
随机推荐
- 在右键添加Cmder here选项,添加启动Cmder的快捷键
右键菜单添加“Cmder here” 打开cmder,在其中输入: cmder /register user 或 cmder /register all 即可 设置启动cmder的快捷键 右键 C ...
- 今日哈工大刷推荐python脚本
import httplib import random import time import urllib2 import re address = raw_input("Please i ...
- Spring中IoC - 两种ApplicationContext加载Bean的配置
说明:Spring IoC其实就是在Service的实现中定义了一些以来的策略类,这些策略类不是通过 初始化.Setter.工厂方法来确定的.而是通过一个叫做上下文的(ApplicationConte ...
- ORA-01653:表无法通过64(在表空间USERS中)扩展
问题描述:oracle插入数据时显示ORA-01653 表无法通过64(在表空间USERS中)扩展 原因: oracle 表空间满了,需要扩展 截图: 解决方法: 1.首先查下表空间 select ...
- JQuery 的基本命令
调用jquery的格式 <script> $(document).ready(function() { }); </script> 笔记 1.现在让我们开始写第 ...
- 做为一个Java程序员,你需要哪些傍身的技能?
最近总有些断断续续的思考,想想从我入行以来,我到底学会了什么,做成过什么,以后要做什么,如何提升自己······· 工作3年了,常听人说3年,5年,10年是程序员的坎,每过一个都会有新的想法,新的改变 ...
- js监听和观察者模式
http://redhacker.iteye.com/blog/1756436 https://developer.mozilla.org/en-US/docs/Web/Guide http://ww ...
- css案例学习之relative与absolute
代码 <!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.o ...
- 乐酷工作室孙志伟:Testin云測试有广度有深度 省钱省力值得信赖
乐酷工作室孙志伟:Testin云測试有广度有深度 省钱省力值得信赖 2014/10/16 · Testin · 开发人员訪谈 乐酷工作室是一个专业从事移动终端应用及游戏自主研发和运营的创业团队,眼下拥 ...
- Endian.BIG_ENDIAN和Endian.LITTLE_ENDIAN(http://smartblack.iteye.com/blog/1129097)
Endian.BIG_ENDIAN和Endian.LITTLE_ENDIAN 在ByteArray和Socket中,能看到一个属性endain. endian : String 更改或读取数据的字节顺 ...