没有删除溢出隐藏我怎么能显示div框?

时间:2013-05-30 07:08:00

标签: jquery css html5

这是我的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();
    });
});

现在,当我的鼠标悬停在.replaybox上时,我想要的是.caption div高度为30px。现在,当我点击跨度时,我将跨度放在.caption类中,以便.div类切换,并且隐藏时间.replaybox溢出,以便隐藏我的.div框主要课程,我怎样才能在高度和高度上显示。 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/

1 个答案:

答案 0 :(得分:0)

jsFiddle of your link

你添加了一个隐藏现在你需要show()

$(function(){

        $('.caption').hide();
        $('.replaybox').hover(function(){

            $('.caption',this).show(50).animate({opacity: 1,
            height: 30}, 200);
        },function(){

                $('.caption',this).animate({opacity: 0,
            height: 0 }, 200);


        });

        $('span').click(function(){

            $('.div',this).slideToggle();

        });  
});