2012-02-14 9 views
0

から開くようにアニメーションんこんにちは、私はこの使用しています:私は左開くために継続して2最初が、最後にしたい、開いているすべての左側をjQuery resize div box at hoverを、私はしたいが、私は4つの正方形を持っているとして、それは正確んが、彼ら例えば、右を開くために2:どのように私は右

最初の2:

- >過去2右

を左に開きます:

<は - 誰もがここで私を助けることができる

を右から左に開きますか?

+0

'$( 'セレクタ')アニメーション({幅:表示/非表示})'あなたが始める必要があります。 – Sarfraz

答えて

0

私はボックスでは、提供されたリンクから、右のように開くことを前提としています。アニメーション機能に「+ = 50」: - 「= 50」と左:ボックスは左開くようにするためにあなたが見ることができるように私は、余分なラインが残っ追加(たとえばboxleft)

$('.content_area div').hide(); 

initwidth = $('.boxleft').width(); 
initHeight = $('.boxleft').height(); 

$(function() { 
    $('.boxleft').bind('mouseenter', function() { 
     $(this).children('.more').show(); 
     $('.boxleft').not(this).stop(true, true).fadeTo('normal', 0.2); 
     $(this).stop(true, true).animate({ 
      width: '70', 
      height: '70', 
      left: '-=50' 
     }, { 
      queue: true, 
      duration: 'fast' 
     }).css('font-size', '1.2em'); 
    }); 
    $('.boxleft').bind('mouseleave', function() { 
     $(this).children('.more').hide(); 
     $('.boxleft').not(this).stop(true, true).fadeTo('normal', 1); 
     $(this).stop(true, true).animate({ 
      width: initwidth, 
      height: initHeight, 
      left: '+=50' 

     }, { 
      queue: true, 
      duration: 'slow' 
     }).css('font-size', '1em'); 
    }); 

別のクラスを追加することができます。