jQuery使用right属性设置展开和收缩动画

我在一个页面上有两个框，当你按下一个蓝色框时，一个框会以动画的形式向右展开。蓝色框变为红色框，红色框应该是按钮，用于恢复其原始大小（宽度）和位置。（第二个框应该保持在右上角。）当它再次收缩到原始尺寸时，按钮应变回蓝色，并且过程可以再次开始，以便继续进行扩张和收缩

$(document).ready(function () {

//open & close 1 //open & close 2... (irrelevant code omitted here, just some extra buttons)

//minimise 1
$(".minT").click(function () {
    $('.box1').animate({right:'+=49.5%'}, "slow");
});
//change minimise to expand
$(".minT").click(function () {
$('.minT').removeClass('minT').addClass('expT');
});

//expand 1 & close 2
$(".expT").click(function () {
    $('.box2').animate(
    {width:'20px',
    height:'20px',
    right:'75px',
    top:'5px',
    bottom:'show',
    left:'90%'}, "fast", function(){
        $('.box1').animate({right:'-=49.5%'}, "slow", function(){
});});});
//change expand button to a minimise button
$(".expT").click(function () {
$('.expT').removeClass('expT').addClass('minT');
});
});

我不知道我要做什么才能让它工作。。。我试着在最小化代码部分修改正确的值，但它似乎不喜欢，只是扩展得越来越多。（我还将expand值设置为right:'1%'这使它处于相同的位置，但当我单击红色框时，它不会做任何事情。）这可能与我将类从expT更改为minT有关吗

这里有一个链接可以使用：

谢谢你能提前给我的任何帮助

Pbob

删除类时，必须

解除绑定（“单击”）

。删除旧类并添加新类后，它仍在执行旧类的单击事件。我更新了小提琴

$(".expT").click(function () {
        $('.expT').removeClass('expT').unbind("click").addClass('minT').click(function(){
            $('.box1').animate({right:'+=49.5%'}, "slow");
        });
});

---

这将使

box1

返回到其原始大小。

所以唯一的问题是不断扩展而不是返回到其原始大小？@user1795832是的，它应该能够收缩，然后能够再次扩展和互换尼斯，谢谢！尽管当你点击minT时，它应该改回expT类。这是一把新的小提琴，它不断膨胀，不断收缩，不断膨胀——我想我忘了保存我做的小提琴了。这里有一个新的链接-啊，我明白了！非常感谢你，我从中学到了很多。只有一个问题，为什么必须使用unbind&removeClass函数将其设置为“.box 1 div”，而不只是选择.expT从中删除类？谢谢你的帮助：没有理由。我就是这样写的。它可以是

$（'.minT'）

或

$（'.expT'）