我正在编写一些 jQuery 代码来为所有 .linkbox 设置动画以增加高度并且它工作得很好除了我点击的元素比其他两个元素慢(所以它就像悬停时更慢)，我如何使所有三个元素以完全相同的方式进行动画处理，他们不应该已经这样做了吗？他们也从底部开始动画，是否可以告诉它从顶部开始动画？
这是所有代码的链接:http://jsbin.com/fihes/2/edit?html,css,js,output
提前致谢!
html:
<body>
<div class="linkbox"><div class="text">Om mig</div></div>
<div class="linkbox"><div class="text">Portfolio</div></div>
<div class="linkbox"><div class="text">Kontakt</div></div>
</body>
CSS:
body{
background:black;
background-attachment:fixed;
width: 102%;
margin: 0px;
padding: 0px;
}
.linkbox{
opacity: 0.5;
width:33%;
height: 200px;
background-color: #ffffff;
padding: 0px;
margin: -2px;
display:inline-block;
margin-top: 35%;
}
.linkbox:hover{
opacity: 1;
transition: all 0.4s ease;
}
.text{
text-align:center;
font-family: Helvetica;
font-size: 42px;
padding: 74px;
}
jQuery:
$(document).ready(function(){
$('.linkbox').click(function(){
$('.linkbox').animate({height:"400px"}, "slow", "swing");
});
$('.text').click(function(){
$('.text').fadeTo("fast", 0);
});
});
最佳答案
您的点击代码较慢，因为您有 "slow" ，您可以将其更改为 "fast" ，如下所示:
$('.linkbox').click(function(){
$('.linkbox').animate({height:"400px"}, "fast", "swing");
});
要回答您的第二个问题，我认为仅使用 .animate() 是不可能让它从上向下滑动的。但是，有 .slideDown() 效果。
The .slideDown() method animates the height of the matched elements. This causes lower parts of the page to slide down, making way for the revealed items
关于javascript - 悬停时的 jQuery 动画延迟，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/21798929/