Разверните ящик с помощью jquery

Question

когда я нажимаю на одну ссылку панели «привет» или «Привет», эта панель должна быть развернута, и на странице должна отображаться только эта панель, опять же, когда я щелкаю ее обратно, она должна перейти в исходное положение, то же самоедля другой панели я попытался реализовать, но в некоторых случаях я отключился, когда я нажимаю на ссылку приветствия, ее можно развернуть, но другую страницу также можно просмотреть на странице.

 http://jsfiddle.net/Soni/tRen6/1/



<script>
$(function() {
    $("#container").sortable({
        handle: 'h1',
        scroll: false,
        revert: true,
        tolerance: 'touch'
    });
$(".button").toggle(function() {
        $(this).parent().animate({
            backgroundColor: "#0000",
            width: 1000,
        }, 500);
    }, function() {
        $(this).parent().animate({
            backgroundColor: "#000",
            width: 100,

        }, 500);
    });

});

Answer 1

Не элегантный способ, но он работает

$(function() {
$("#container").sortable({
    handle: 'h1',
    scroll: false,
    revert: true,
    tolerance: 'touch'
});

$(".button").toggle(function() {
    $(this).parent().animate({
        backgroundColor: "#0000",
        width: 500,
    }, 500);
    $(".button").fadeOut();
    $(this).fadeIn();
}, function() {
    $(this).parent().animate({
        backgroundColor: "#000",
        width: 100,
    }, 500);
    $(".button").fadeIn();
    $(this).fadeIn();

});

});

Проверьте, решено ли это.

Вы также можете увидеть следующий или перед

Или, возможно, создайте класс для каждого элемента.

или попробуйте сосчитать с помощью eq ().Но я не знаю, где вы собираетесь использовать.