这是我的 Jquery 代码:
$(document).ready(function () {
$('.caption').hide();
$('.replaybox', this).hover(function () {
$('.caption', this).stop().animate({
opacity: 1,
height: 30
}, 200);
}, function () {
$('.caption', this).stop().animate({
opacity: 0,
height: 0
}, 200);
});
$('span').click(function () {
$('.div', this).slideToggle();
});
});
现在,当我的鼠标悬停在 div 高度上时,我想要的.replaybox
是.caption
动画 30 像素。.caption
现在,当我单击 span 时,我将 span 放在Class 中,因此.div
class 是切换的,并且时间.replaybox
溢出被隐藏,所以我的.div
框隐藏在 main class 中,所以我如何在顶部显示 height 和 with。HTML 代码是野兔:
<div class="replaybox">
<div class="caption">
<span>
<img src="coffe.png"/>
<div class="div"></div>
</span>
<span>
<img src="emotion.png"/>
<div class="div"></div>
</span>
<span>
<img src="podcast.png"/>
<div class="div"></div>
</span>
<span>
<img src="cog.png"/>
<div class="div"></div>
</span>
</div>
</div>
您还可以在此链接中看到:http: //jsfiddle.net/Abhinav/yYW9C/7/