jQuery点击相册图片拼成大图幻灯片炫酷特效

jQuery点击相册图片拼成大图幻灯片炫酷特效3910
jQuery点击相册图片拼成大图幻灯片炫酷特效3911
var ImgUrl=["img/0.jpg","img/1.jpg","img/2.jpg","img/3.jpg","img/4.jpg","img/5.jpg","img/6.jpg","img/7.jpg","img/8.jpg","img/9.jpg","img/10.jpg","img/11.jpg","img/12.jpg","img/13.jpg","img/14.jpg","img/15.jpg","img/16.jpg","img/17.jpg","img/18.jpg","img/19.jpg","img/20.jpg","img/21.jpg","img/22.jpg","img/23.jpg","img/24.jpg"];var ImgPV_T = [];var ImgPV_L = [];var arr     = []; var leftP   = [];var topP    = [];var body_bg = new Image();body_bg.src = 'img/body_bg.jpg';$(body_bg).load(function (){	var bodyH  = 0;	var bodyW  = 0;	var DivObj = $(".container");	var UlObj  = $(".content");	var LiObj  = $(".content li");	var AObj   = $(".content li a");	var Img    = $(".content li img");	var Strong = $(".content li strong");	var Index  = 0;	var trues  = true;	var marLs  = 0;	var width_W  = 0;	var height_W = 0;	var time;	var marginLeft;	var marginTop=0;	var xyz;	 		//获取窗口大小	function bodys(){	  bodyH= parseInt($("body").css("height"));	  bodyW= parseInt($("body").css("width"));		};		//隐藏gif	function GifNone(){		bodys();		$(".load").css("display","none");		CDispersion(600);		rotate(true);		var r=setTimeout(style,600);	};		//图片加载和归位	$(function ImgPValue(){		var Top  = 0;		var Left = 0;		var left_P= 0;		var top_P = 0;		var x    = 0;		for(var i=0; i0.5){				LiObj.eq(i).css({					"transform":"rotate("+x+"deg)",					"-o-transform":"rotate("+x+"deg)",					"-moz-transform":"rotate("+x+"deg)",					"-webkit-transform":"rotate("+x+"deg)"				});			}else{				LiObj.eq(i).css({					"transform":"rotate("+-x+"deg)",					"-o-transform":"rotate("+-x+"deg)",					"-moz-transform":"rotate("+-x+"deg)",					"-webkit-transform":"rotate("+-x+"deg)"				});				};		};	};		//container散开	function style(){						$(".content li img").animate({"margin":"5px","width":"150px","height":"90px"},300);	};	function CDispersion(s){		var width    = parseInt(bodyW/100*80);		var height   = parseInt(bodyH/100*80);		marginTop    = (height-(height*0.8)-100)/2;		var marginT  = parseInt(height/2);			width_w  = width;			height_w = height;		var margin_1 = parseInt(width/2);		var margin_2 = parseInt(width-(width/100*80+160));		var margin_3 = parseInt(margin_2/2);		marLs        = margin_3;		var marginL  = margin_1-margin_3;		marginLeft   = marginL;		xyz=marginT;				$(".content li span a,.content li span strong").fadeOut(1000);		DivObj.animate({			"width":width+"px",			"height":height+"px",			"margin-top":-marginT+marginTop+"px",			"margin-left":-marginL+"px"			},s,function (){			if(trues){				UlObj.css({					"width":width+"px",					"height":height+"px"				});			};		});	};		//窗口大小改变事件	$(window).resize(function (){		$(".left").animate({"margin-left":"-95px"},400);		$(".right").animate({"margin-right":"-95px"},400);		UlObj.css("box-shadow","0px 0px 0px 0px #111111");		UlObj.stop(true);		trues=false;		bodys();		DivObj.stop(true);		CDispersion(0);		time = setTimeout(UlWH,300);	});	function UlWH(){		UlObj.stop(true);		DivObj.stop(true);		clearTimeout(time);		width_w  = parseInt(DivObj.css("width"));		height_w = parseInt(DivObj.css("height"));		rotate(true);		UlObj.animate({			"width":width_w+"px",			"height":height_w+"px",				"margin-top":"0px",			"margin-left":"0px"		},800,function (){		style();			});		};		//鼠标点击集合	$(".content li").click(function (){		UlObj.stop(true);		DivObj.stop(true);		clearTimeout(time);		if(parseInt(UlObj.css("width"))!=800){			var marginT=(height_w-500)/2;			var marginL=(width_w-800)/2;			Index=$(this).index();						$(".content li img").animate({"margin":"0px","width":"160px","height":"100px"},200,function (){				UlObj.animate({				"width":"800px",				"height":"500px",				"margin-top":marginT+"px",				"margin-left":marginL+"px"									},1000);				DivObj.animate({"margin-left":-marginLeft-marLs+"px","margin-top":-xyz+"px"},1000,function (){					UlObj.css({"box-shadow":"2px 2px 6px -1px #111111"});					$(".left").animate({"margin-left":"0px"},400);					$(".right").animate({"margin-right":"0px"},400);					});				rotate(false);			});							ImgBgPos(ImgUrl[Index],1000);		}		else{			$(".left").animate({"margin-left":"-95px"},400);			$(".right").animate({"margin-right":"-95px"},400);			UlObj.css("box-shadow","0px 0px 0px 0px #111111");			UlObj.animate({				"width":width_w+"px",				"height":height_w+"px",				"margin-top":"0px",				"margin-left":"0px"			},600);			rotate(true);			time = setTimeout(style,600);			$(".content li span a,.content li span strong").fadeOut(700);			DivObj.animate({"margin-left":-marginLeft+"px","margin-top":-xyz+marginTop+"px"},600);		};	});		//鼠标点击换图	var p=0;	$(".left").click(function (){		if(Index==0){			Index=arr.length-1;			}else{			Index--;		}		arr.sort(function(){ return 0.5 - Math.random() });		if(p==0){			Strong.css("left","160px");			ImgHD();		}else{			AObj.css("left","160px");			ImgHD();		};			});	$(".right").click(function (){		if(Index==AObj.length-1){			Index=0;			}else{			Index++;			};		arr.sort(function(){ return 0.5 - Math.random() });		if(p==0){			Strong.css("left","-160px");			ImgHD_2();		}else{			AObj.css("left","-160px");			ImgHD_2();		};			});	function ImgHD_2(){		AObj.stop(true,true);		Strong.stop(true,true);		var y=Math.random();		var i=0;		if(p==0){			function bg_3(s){				if(y<0.5){					s=200;				};				Strong.eq(arr[i]).css("background","url("+ImgUrl[Index]+") "+leftP[arr[i]]+"% "+topP[arr[i]]+"%");				AObj.eq(arr[i]).animate({"left":"160px"},s,function (){					$(this).css("left","-160px");				});					Strong.eq(arr[i]).animate({"left":"0px"},s);				i++;				if(i0.5){						bg_3(800);					}else{						time = setTimeout(bg_3,20)					};				}else{					p=1;				};			};						bg_3(800);		}else{			function bg_4(s){				if(y<0.5){					s=200;				};				AObj.eq(arr[i]).css("background","url("+ImgUrl[Index]+") "+leftP[arr[i]]+"% "+topP[arr[i]]+"%");				Strong.eq(arr[i]).animate({"left":"160px"},s,function (){					$(this).css("left","-160px");										});					AObj.eq(arr[i]).animate({"left":"0px"},s);								i++;				if(i0.5){						bg_4(800);					}else{						time = setTimeout(bg_4,20)					};				}else{					p=0;				};			};						bg_4(800);		};		};	function ImgHD(){		AObj.stop(true,true);		Strong.stop(true,true);		var y=Math.random();		var i=0;		if(p==0){			function bg_1(s){				if(y<0.5){					s=200;				};				Strong.eq(arr[i]).css("background","url("+ImgUrl[Index]+") "+leftP[arr[i]]+"% "+topP[arr[i]]+"%");				AObj.eq(arr[i]).animate({"left":"-160px"},s,function (){					$(this).css("left","160px");				});					Strong.eq(arr[i]).animate({"left":"0px"},s);				i++;				if(i0.5){						bg_1(800);					}else{						time = setTimeout(bg_1,20)					};				}else{					p=1;				};			};						bg_1(800);		}else{			function bg_2(s){				if(y<0.5){					s=200;				};				AObj.eq(arr[i]).css("background","url("+ImgUrl[Index]+") "+leftP[arr[i]]+"% "+topP[arr[i]]+"%");				Strong.eq(arr[i]).animate({"left":"-160px"},s,function (){					$(this).css("left","160px");										});					AObj.eq(arr[i]).animate({"left":"0px"},s);								i++;				if(i0.5){						bg_2(800);					}else{						time = setTimeout(bg_2,20)					};				}else{					p=0;				};			};						bg_2(800);		};		};});

也许你还喜欢