我有一个需要互动的元素网格.单击其中一个div时,它将增大到更大的大小.对于大多数元素“增长”,可以接受右下角的div:
$(.my-div).animate({ width: "379px", height: "204px" });
但是,在某些情况下,从右下角“增长”将无法与其他应用程序一起使用.
例如,我可能需要从右上角成长.有任何想法吗?我喜欢将动画设置为新的宽度/高度的简单性,但我不确定它是否可以实现除了从右下角拖动之外的效果.
提前致谢 :)
最佳答案 你可以通过几种方式来实现它,无论是你提到的jQuery动画,还是CSS转换.它们看起来像
.child.clicked {
height: 100px;
width: 300px;
transition: width 2s, height 2s;
-moz-transition: width 2s, height 2s;
-webkit-transition: width 2s, height 2s;
-o-transition: width 2s, height 2s;
}
要么
$('.child2').click(function() {
$(this).animate({
width: ['300px', 'swing'],
height: ['100px', 'swing']
}, { duration: "slow", easing: "easein" });
});
这是一个玩具http://jsbin.com/uxicil/1/edit的例子
有许多缓动属性和要调整的东西,直到你得到它想要的方式.