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
            });    
    }  
}

ここにJsフィドルがあります http://jsfiddle.net/xtatanx/PNEhD/

いくつかの詳細情報:

要素をドラッグしないと元の位置に戻りますが、ドラッグしても元の位置には戻りません。

2番目の編集:

これまでのところ、これは良い改善です: 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 に答える