jquery - 动态添加的类的元素变得不可点击

Question

我创建了一个电梯功能[有 2 个楼层，每个楼层对应，有一个复选框。根据选中的复选框，电梯会移动到该楼层。

我不确定如何实施的几件事是：

1. 无论我在哪里动态添加了“未选中”类，该元素看起来都好像不可点击。我如何使它可点击？

2. 当橙色电梯在
   选中复选框的水平移动和停止时，如何减慢它的速度？

小提琴可在：[http://jsfiddle.net/hurricaneankit/rJ4Py/12/]

Answer 1

我认为这就是您要寻找的东西-jsFiddle

$(document).ready(function () {
    $("#check1, .checked1").click(function () {
        $('.checked1').addClass('fade');
        $('.checked2').removeClass('fade');
        $("#groundDiv").animate({
            "top": "0px"
        }, 2000);
    });
});
$(document).ready(function () {
    $("#check2, .checked2").click(function () {
        $('.checked2').addClass('fade');
        $('.checked1').removeClass('fade');
        $("#groundDiv").animate({
            "top": "-65px"
        }, 2000);  
    });
});

css-

.fade{
    -webkit-animation: fade 3.5s;
    -moz-animation: fade 3.5s;
    -o-animation: fade 3.5s;
    animation: fade 3.5s;
}
@keyframes fade{
    0%{opacity:0;}
    50%{opacity:1;}
    100%{opacity:0;}
}