码迷,mamicode.com
首页 > 编程语言 > 详细

Javascript常见操作

时间:2015-12-10 14:54:21      阅读:152      评论:0      收藏:0      [点我收藏+]

标签:

图片预加载


var image = new Image();
image.onload = onLoad;
image.onerror = onLoad;
image.src =src;

image.complete

图片懒加载


function lazyHandler() {
	lazyLoadImages = pageContainer.find(‘.lazy‘);
	lazyLoadImages.each(function(index, el) {
		el = $(el);
		if (isElementInViewport(el[0])) {
			loadImage(el);
		}
	});
}

function isElementInViewport (el) {
	var rect = el.getBoundingClientRect();
	var threshold = app.params.imagesLazyLoadThreshold || 0;
	return (
		rect.top >= (0 - threshold) &&
		rect.left >= (0 - threshold) &&
		rect.top <= (window.innerHeight + threshold) &&
		rect.left <= (window.innerWidth + threshold)
	);
}
function attachEvents(destroy) {
	var method = destroy ? ‘off‘ : ‘on‘;
	pageContent[method](‘lazy‘, lazyHandler);
	pageContent[method](‘scroll‘, lazyHandler);
	$(window)[method](‘resize‘, lazyHandler);
}
lazyHandler();
attachEvents();


下拉刷新


function handleInfiniteScroll() {
	var inf = $(this);
	var scrollTop = inf[0].scrollTop;
	var scrollHeight = inf[0].scrollHeight;
	var height = inf[0].offsetHeight;
	var distance = inf[0].getAttribute(‘data-distance‘);
	var onTop = inf.hasClass(‘infinite-scroll-top‘);
	if (!distance) distance = 50;
	if (typeof distance === ‘string‘ && distance.indexOf(‘%‘) >= 0) {
		distance = parseInt(distance, 10) / 100 * height;
	}
	if (distance > height) distance = height;
	if (onTop) {
		if (scrollTop < distance) {
			inf.trigger(‘infinite‘);
		}
	}
	else {
		if (scrollTop + height >= scrollHeight - distance) {
			inf.trigger(‘infinite‘);
		}
	}
		
}
attachInfiniteScroll = function (infiniteContent) {
	$(infiniteContent).on(‘scroll‘, handleInfiniteScroll);
};
detachInfiniteScroll = function (infiniteContent) {
	$(infiniteContent).off(‘scroll‘, handleInfiniteScroll);
};

 

Javascript常见操作

标签:

原文地址:http://www.cnblogs.com/jonathanzhao/p/5035996.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!