我有以下代码
<h1>Heading</h1>
<div>Content to be displayed</div>
现在单击 h1 时,整体应该向上移动,再次单击 h1 时,两者都应该下降。我如何实现这一点。我使用 jquery 切换功能上下移动 div,但我也希望 h1 向上移动。
最佳答案
首先,为容器元素设置动画是最简单的。
您可以使用 jQuery 来包装它们。
var container = $('h1, div').wrapAll('<div />').parent();
然后你会给那个容器 display: relative
。您可以使用外部样式表(推荐)或 jQuery 来实现。
container.css('position', 'relative');
然后您可以攻击该容器
的点击处理程序。
container.toggle(
function() {
$(this).animate({ top: '-=20px' }, 500);
},
function() {
$(this).animate({ top: '+=20px' }, 500);
});
jsFiddle .
关于javascript - 使div在单击时上下移动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6288675/