我正在努力提高我的jQuery技能,因此我写了一个自己的灯箱。
但有一件事让我发疯。我如何像其他灯箱一样为div设置动画。从中间开始,向两侧展开。我很无奈。
是否可以使用jQuery提供的特殊缓动属性?
$('#clickme').click(function() {
$('#book').animate({
width: 'toggle',
height: 'toggle'
}, {
duration: 5000,
specialEasing: {
width: 'linear',
height: 'easeOutBounce'
},
complete: function() {
$(this).after('<div>Animation complete.</div>');
}
});
});
我希望有人可以帮助我:)
答案 0 :(得分:1)
您还可以为div的顶部和左侧位置设置动画,以提供相对于元素中心调整大小的效果。
<强> jsFiddle example 强>
$('#clickme').click(function() {
$('#lightbox').fadeIn();
$('#lightbox').animate({
width: 500,
height: 250,
top:5,
left:10
});
});
答案 1 :(得分:0)
替换这个,jquery。 也会关闭你打开的div。 感谢'j08691'的帮助。
$('#clickme').click(function() {
$('#lightbox').fadeIn();
$('#lightbox').animate({
width: 500,
height: 250,
top:5,
left:10
});});
$('#lightbox').click(function() {
$('#lightbox').animate({
width: 0,
height: 0,
top:0,
left:0,
}).fadeOut();
});