Jquery слайдов Слева направо

Question

http://jsfiddle.net/uw8Kz/2/ шахта не работает

$(document).ready(function() { 
$('.mybutton').click(function() { 
    var $lefty = $(this).next(); 
    $lefty.animate({ 
    left: parseInt($lefty.css('left'),10) == 0 ? 
    -$lefty.outerWidth() : 
    0 
    }); 
}); 

});

помощь в настройке данного кода, который я получил от http://examples.learningjquery.com/slide/

в основном я просто хочу, чтобы имитировать это «Обслуживание клиентов» effect

Answer 1

var $lefty = $(this).next(); 

$(this) является последним ребенком (.mybutton) и next() не вернет ничего , поэтому $lefty будет пустым.

var $lefty = $(this).parent(); 

должно работать лучше (если я правильно вас понял).

Demo

Answer 2

Вот моя работа:

$(document).ready(function() { 
    $('#slideleft .mybutton').click(function() { 
    var $marginLefty = $(this).parent(); 
     $marginLefty.animate({ 
     marginLeft: parseInt($marginLefty.css('marginLeft'),10) == 0 ? 
     $marginLefty.outerWidth() : 
     0 
    }); 
    }); 
}); 

Demo: LEFT TO RIGHT

Answer 3

ваш HTML не ваш JS, следующий относится к следующему элементу в то время как вы его предыдущим, вы должны либо замените его на prev или просто перегруппируйте ваш html и le ft работает с позиционированием css. но так как вы хотели этого эффекта, анимация применяется к родительскому объекту.

<div id="slideleft" class="slide"> 
    <div class="inner"> 
     <div class="mybutton">SLIDE IT</div> 
     <div class="scontent" style="position:absolute">Animate this element's left style property</div> 
    </div> 
</div> 
<div class="cls"></div>