在img / text的悬停时，jQuery从左到右滑动div

Question

我正在尝试在hover的{​​{1}}上滑动文字，另一个div也应该与img/text一起滑动。

我已经实现了滑动效果，但无法沿着路径滑动div s。 这是demo。

Answer 1

试试这个：

$('.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;
}

选中此http://jsfiddle.net/mqzuD/10/

Answer 2

试试这个

$('div.holdingbox').bind("mouseenter", function() {
      $(this).find('span').animate({
             "left": "+=5px",
                "opacity" : "show"
              }, {
            duration: 1000
      });   
 });

http://jsfiddle.net/mqzuD/8/

希望这是你想要的。