我的客户想要内容固定像素高度,然后在点击链接时显示其余内容。固定像素高度是最大的要求,但这就是他们想要的。
current implementation没有流畅的动画。现在唯一的选择是尝试提前确定高度,然后硬编码该高度或取消注释上面的行并修改要设置动画的样式描述。
如果您不想查看示例,请参阅以下相关代码:
$(function() {
$('.see-more').click(function(e) {
$(this).parents(".module").css("height", "inherit");
e.preventDefault();
$(this).fadeOut('fast', function(){
$(this).siblings(".blurb").css("height", "100%");
$(this).siblings(".blurb").animate({
overflow: "visible"
}, 10000);
});
return false;
});
});
理想的实现方式是允许我平滑地设置高度和溢出样式属性的动画。
更新
根据以下评论,我创建了一个jsfiddle here。点击“查看更多...”链接将演示我想要描述的内容。