js代码_js特效免费下载_JS特效代码网   网页特效   鼠标特效   js图片相册   js特效代码大全
当前位置:首页 > 网页特效 > JS广告代码 > JS幻灯片

js仿淘宝首页缓冲幻灯片特效

发布时间:2015-09-02 12:08:03    您是第0位浏览者

本js特效代码兼容:ie6 、ie7 、ie8 、ie9 、ie10 、ie11 、chrome 、firefox 、opera 、safari 、 等浏览器

js仿淘宝首页缓冲幻灯片特效
/* 代码整理:js代码网 www.jstxdm.com */
function css(obj, attr, value) {
	if (arguments.length == 2) {
		if (attr != 'opacity') {
			return parseInt(obj.currentStyle ? obj.currentStyle[attr] : document.defaultView.getComputedStyle(obj, false)[attr]);
		} else {
			return Math.round(100 * parseFloat(obj.currentStyle ? obj.currentStyle[attr] : document.defaultView.getComputedStyle(obj, false)[attr]));
		}
	} else if (arguments.length == 3) switch (attr) {
	case 'width':
	case 'height':
	case 'paddingLeft':
	case 'paddingTop':
	case 'paddingRight':
	case 'paddingBottom':
		value = Math.max(value, 0);
	case 'left':
	case 'top':
	case 'right':
	case 'bottom':
	case 'marginLeft':
	case 'marginTop':
	case 'marginRight':
	case 'marginBottom':
		obj.style[attr] = value + 'px';
		break;
	case 'opacity':
		obj.style.filter = "alpha(opacity:" + value + ")";
		obj.style.opacity = value / 100;
		break;
	default:
		obj.style[attr] = value;
	}
	return function(attr_in, value_in) {
		css(obj, attr_in, value_in)
	};
}


//obj是指要运动的物体
//itype是要采取哪种类型的运动move_type.buffer为缓冲运动,move_type.flex弹性运动。
//oTarget是目标要运行到多少来.默认是px所以不需要带单位。
//fnCallBack运动结束要做些什么。
//fnduring在运动中要进行什么
function startMove(obj, oTarget, iType, fnCallBack, fnDuring) {
	var bStop = true;
	var attr = '';
	var speed = 0;
	var cur = 0;
	if (obj.timer) {
		clearInterval(obj.timer);
	}
	obj.timer = setInterval(function() {
		startMove(obj, oTarget, iType, fnCallBack, fnDuring);
	}, 30);
	for (attr in oTarget) {
		if (iType == 'buffer') {
			cur = css(obj, attr);
			if (oTarget[attr] != cur) {
				bStop = false;
				speed = (oTarget[attr] - cur) / 5;
				speed = speed > 0 ? Math.ceil(speed) : Math.floor(speed);
				css(obj, attr, cur + speed);
			}
		} else if (iType = 'flex') {
			if (!obj.oSpeed) obj.oSpeed = {};
			if (!obj.oSpeed[attr]) obj.oSpeed[attr] = 0;
			cur = css(obj, attr);
			if (Math.abs(oTarget[attr] - cur) >= 1 || Math.abs(obj.oSpeed[attr]) >= 1) {
				bStop = false;
				obj.oSpeed[attr] += (oTarget[attr] - cur) / 5;
				obj.oSpeed[attr] *= 0.7;
				css(obj, attr, cur + obj.oSpeed[attr]);
			}
		}
	}
	if (fnDuring) fnDuring.call(obj);
	if (bStop) {
		clearInterval(obj.timer);
		obj.timer = null;
		if (fnCallBack) fnCallBack.call(obj);
	}
}
/* 代码整理:js代码网 www.jstxdm.com */

/*var arr=[12,44,555,444,666];
var imax=999999999;
var imaxp=0;
var imin=-99999;
var iminp=0;
for(var i=0;i<arr.length;i++){
	if(arr[i]<imax){
		imax=arr[i]
		imaxp=i
		}
	else if(arr[i]>imin){
		imin=arr[i]
		iminp=i
		}
	}
alert("最小数字为:"+imax+"它在第几位"+imaxp)
alert("最大数字为:"+imin+"它在第几位"+iminp)*/



幻灯片

js实现轮播幻灯片3D特效并且可以左右翻页

js实现10屏带缩略图和标题的幻灯片轮播特效

JS仿360旅游首页幻灯片效果代码

JS带图片标题自动播放的幻灯片特效

JS视差滑块幻灯片特效

jQuery自动播放淡入淡出的幻灯片特效

jquery.slider多种过渡效果的图片轮播幻灯片特效

js仿淘宝首页缓冲幻灯片特效

jquery实现4款自定义图片切换幻灯片js特效

jquery仿支付宝全屏图片幻灯片淡出淡进切换特效

jquery实现婚纱摄影网站宽屏图片幻灯片轮播切换特效

jquery实现 ChinaJoy2014专题幻灯片特效

jQuery幻灯片插件,按钮控制图片过渡特效

jquery仿百度百科2014新首页幻灯片特效

jquery实现淡出淡入带缩略图的广告图片幻灯片切换特效

jquery仿腾讯新闻网站带缩略图的幻灯片切换代码_js代码

jquery仿搜狐2014巴西世界杯专题幻灯片特效

jquery仿新浪2014成都车展幻灯片

jquery仿网易2014巴西世界杯专题幻灯片特效

jquery仿腾讯网新闻图片特效带缩略图的幻灯片切换特效