1

我有一个固定位置的 div,所以我只能看到一个选项卡,当您单击此 div 元素上的按钮时,它会显示在舞台上并且也可以拖动,到目前为止一切都很好。现在我正在尝试通过动画使相同的元素返回到其原始位置,并且我还希望它在隐藏为选项卡时不可拖动。我一直在尝试使用 $(some-element).animate(),我可以在 HTMl 上看到它设置了我给他的属性,但它永远不会被动画化,我也不知道如何删除可拖动功能。我正在学习所有这些东西,如果有人可以帮助我弄清楚如何做到这一点,我将不胜感激。非常感谢你们!!。生病留给你我的 jquery 代码和小提琴,所以你们可以看到发生了什么。

jQuery

$("#minimize").on("click", display);
function display(){
    if(!$("#box").hasClass("draggable")){
        $("#box").animate({bottom: "20"}).addClass("draggable");
        $(".draggable").draggable();    
        }else{
            $("#box").removeClass("draggable");  
            $("#box").animate({
            bottom: -221
            });    
    }  
}

这是 te Js fiddle http://jsfiddle.net/xtatanx/PNEhD/

更多信息:

如果你不拖动它,元素会返回到它的位置,但是如果你拖动它,它不会返回到它的位置。

第二次编辑:

到目前为止,我已经有了这个,这是一个很好的改进: http: //jsfiddle.net/xtatanx/PNEhD/ 但我想避免在roder中重置样式时跳转以使动画无论对象位于何处都流畅

4

1 回答 1

3

这是因为可拖动设置了顶部位置,并且在您可以向底部位置设置动画之前需要清除它,因为顶部仍然设置。

这是你更新的 JS

$("#minimize").on("click", display);

function display() {
    if (! $("#box").hasClass("draggable")) {
        $("#box").animate({bottom: "20"}).addClass("draggable");
        $(".draggable").draggable();    
    } else {
        $("#box").removeClass("draggable");  
        $('#box').css('top', '');
        $("#box").animate({
            bottom: -221
        });    
    }  
}

这是小提琴的链接:http: //jsfiddle.net/PNEhD/1/

于 2013-05-30T23:12:09.150 回答