jQuery点击图片展开文字标题描述代码

这是一款jQuery鼠标点击图片展开文字描述代码，有点类似手风琴展开效果，但又不尽相同。鼠标移至图片上，图片显示标题，点击则隐藏其它图片让出位置来展示文字描述。
相关JS
<scripttype="text/javascript">
$(document).ready(function(){//------------------------------------------鼠标点击图片
$('#aaa').children('li').click(function(){

wz=$(this).css('left');
dq=$(this).index();

$(this).siblings(dq).fadeOut();
$(this).animate({left:'0px'},1000);

$(this).children('img').animate({opacity:'1'});
$(this).children('.aaays').css('display','none');
$('#dang').css('z-index','999');

//------------------------------------------鼠标划出全部的时候
$('#name').children('div').eq(dq).animate({top:'0px'},1000);
});

$('#nav').hover(function(){},function(){
$('#nav').find('li').fadeIn();
$('#nav').find('li').eq(dq).animate({left:wz},1000);
$('#name').children('div').eq(dq).animate({top:'-500px'});
$('#dang').css('z-index','0');
})//------------------------------------------鼠标滑过透明$('#aaa').children('li').hover(function(){
$(this).children('img').animate({opacity:'0.5'},500);
$(this).children('.aaays').css('display','block');
},function(){
$(this).children('img').animate({opacity:'1'});
$(this).children('.aaays').css('display','none');
});});
</script>



下载

2023-11-23 01:29 上传

点击文件名下载附件
售价: 3 金币  [记录]  [购买]