Slide up element on hover
<p>Take a look at <a href="http://www.shopvcf.com/blog/?page_id=56" rel="nofollow">http://www.shopvcf.com/blog/?page_id=56</a></p>

<p>I need the area with the red heart to slide up which I have done with this code. </p>

<pre><code>$(document).ready(function () {
    $('div.bottomwrap').on({
        'mouseenter': function () {
            $(this).animate({
                bottom: 20
            });
        },
        'mouseleave': function () {
            $(this).animate({
                bottom: 0
            });
        }
    });
});
</code></pre>

<p>Issue is I would like it to slide up when entering into the box with the content, not just the bottomwrap.</p>

<p>I would also like to hide the   at the same time which will show the image in the background.</p>

<p>Any help would be great. Thanks!</p>
