我想知道是否有人对任何简单的轻量级 jQuery 画廊有经验。
我对这个特定项目的要求非常简单,并且我已经真正尝试编写自己的代码,但这对于初学者来说有点令人费解。
我有一个加载初始图像的大 div。随后是任意数量的缩略图图像,并带有指向它们各自较大图像的链接。这些图像都具有相似的宽度,但具有不同的高度。
我想单击一个缩略图,让大图像 div 淡出图像,将高度设置为新图像(当然是动画),然后淡入新图像。
我玩过将不透明度设置为 1% 以产生这种错觉,因为将不透明度设置为 0 似乎会完全折叠 div。
它不需要幻灯片或任何功能,但有时主 div 会完全崩溃。
这是我的代码
$('.clickedimage').click(function() {
var newhref = $(this).attr('href'); // sets the variable for the new link
var curheight = $('.bigpic').height(); //gets the current height
$('.bigpic').attr('style', "height:"+curheight+"px" );
$('#largeimage').fadeOut('slow', function(){
$('#largeimage').attr('src',newhref);
$('#largeimage').fadeTo('fast', 0.01, function(){
var aheight = $('#largeimage').height();
$('.bigpic').animate({
height: aheight+'px'
}, 500, function(){
$('#largeimage').fadeTo('slow',1);
});
});
});
return false; // do not follow through with the links and disable them
});