Jquery3D图片轮换
Jq实现的3Q图片切换特效,代码简单,效果不错。

function test{
if(imgScan.isStart==true)
return;
imgScan.isStart=true;
//点击第一张
for (var i = 0; i < $(".centerImg").length; i ) {
var mHeight = $($(".centerImg")[i]).height();
var mLeft = $($(".centerImg")[i]).offset().left - $("#imgCenter").offset().left - 30;
var mTop = (300 - mHeight) / 2;
if (mHeight == 300) {
$($(".centerImg")[i]).animate({
marginLeft: "-500px",
opacity: 0
}, 500, function() {
//回到等待位置
$(this).css("margin-left", "300px").css("display", "none").css("height", "160px").css("margin-top", "70px").css("z-index", "0");
imgScan.isStart=false;
});
} else if (mHeight == 160) {
$($(".centerImg")[i]).css("display", "none").css("z-index", 0);;
$($(".centerImg")[i]).animate({
height: "180px",
marginTop: "60px",
marginLeft: "90px",
opacity: 1
}, 500);
} else {
$($(".centerImg")[i]).css("z-index", mHeight)
$($(".centerImg")[i]).animate({
height: mHeight 40 "px",
marginTop: mTop - 20 "px",
marginLeft: mLeft "px"
}, 500,function(){});
}
}
}演示地址:http://www.pengyaou.com/LegendsZ/eg/3DImgC/
文章出处:http://www.pengyaou.com/LegendsZ/File/2014/07/31/20140731164425214.html
相关推荐
teresalxm 2020-07-25
wallowyou 2020-06-28
nicepainkiller 2020-05-05
淡风wisdon大大 2020-04-21
lcyangcss 2019-12-23
maiktom 2019-12-07
somboy 2019-10-23
libowen0 2016-04-19
zhanghaibing00 2019-09-08
王景迁 2019-06-29
ajhongshaorou 2019-06-28
张大晴 2016-04-19
adeyi 2019-06-27
wolaizheli 2014-09-05
kaiya0 2014-07-28