У меня есть два блока, внутри одного блока находится еще один блок, как можно реализовать его перемещение в правый блок и затем обратно в левый, при клике на него? Знаю что нужно использовать toggleClass и appendTo для переноса в другой блок, но как реализовать обратный механизм???
Ну смотри, я бы сделал так, при клике создавал б переменную которая бы была бы синим блоком, дальше прикрепить к нему класс как ты и сказал, и простое условие, если содержит класс, то присвоить тесту значение родителя, что бы запомнить первый блок, и затем перенести в другой блок с помощью appendTo, а в else который будет выполнятся если у нас нет класса test (а мы его убираем в начале с toggleClass) мы с помощью того же appendTo прикрепляем его обратно цепляясь за заранее сохраненного прежнего родителя, как то так)
#big-1, #big-2{
width: 100px;
height: 100px;
background-color: #fffc77;
border-right: 2px solid orange;
float: left;
}
#small-inner-block {
width: 20px;
height: 20px;
background-color: #00f;
cursor: pointer;
}
<div id="big-1">
<div id="small-inner-block">
<div id="big-2">
var test;
$('#small-inner-block').bind('click', function() {
var ths = $(this);
ths.toggleClass('test');
if (ths.hasClass('test')) {
test = ths.parent();
ths.appendTo("#big-2");
} else {
ths.appendTo(test);
}
});
</script>