我正在尝试源代码,请检查演示链接:
http://jsfiddle.net/bala2024/nvR2S/40/
$('.expand').click(function(){
$(this).stop().animate({
width:'73%',
height:'130px'
});
$('.collapse').show();
});
我正在尝试源代码,请检查演示链接:
http://jsfiddle.net/bala2024/nvR2S/40/
$('.expand').click(function(){
$(this).stop().animate({
width:'73%',
height:'130px'
});
$('.collapse').show();
});
默认情况下,您只需要在 CSS 样式中隐藏所有段落元素:
.expand p {
display: none;
}
然后在 jquery 代码的帮助下显示\隐藏所需的项目。
$('.expand').click(function(){
$(this).stop().animate({
width:'73%',
height:'130px'
});
$(this).find('p').show();
$('.collapse').show();
});
$('.collapse').on('click',function(e){
e.stopPropagation()
$(this).parent('.expand').stop().animate({
width: '30px',
height:'130px'
});
$(this).prev('p').hide();
$(this).hide();
});
我也创建了一个演示fiddle
,所以请检查它。