jQuery slide div from left to right on hover of img /text

Question

I am trying to slide text on hover of an img/text, the other div should also slide along with the div.

I have achieved the sliding effect but not able to slide the divs along the path. Here is the demo.

Answer 1

Try this:

$('.holdingbox').hover(function(){
        $('.rightbox').animate({width: '90px'}, 1000)
    }, function(){
        $('.rightbox').animate({width: '0'}, 1000)
    });

HTML

<div class="holdingbox">
 <span class="leftbox">Stuff</span>
 <span class="rightbox">
     <span class="content">Stuff to reveal</span>
 </span>
</div>
<div class = "box">Text</div>

CSS

.rightbox {
    position: relative;
    display:inline-block;
    overflow:hidden;
    width:0;
    height:30px;
    vertical-align:top;
}
.content{
    width:100px;
    position:absolute;
    left:0;
    top:0;
}

Check this http://jsfiddle.net/mqzuD/10/