2

そのため、私は JavaScript に非常に慣れていないため、残念ながら基本もよくわかりません。

要素をクリックした後に要素を非表示にし、同じボタンをクリックして効果を元に戻すコードに取り組んでいましたが、そうすることができません。コードは次のとおりです。

$(function() {
    $('#boxclose').click(function(){
        $('#md-share-window').animate({'bottom':'-90px'},500,function(){});
    });
});
4

2 に答える 2

1

クラスを使用して、アニメーション化する要素の状態を識別できます。

例を次に示します: http://jsfiddle.net/FgDaq/

$('#boxclose').click(function() {
    var c = 'on',
        el = '#md-share-window',
        duration = 500;

    if ($(el).hasClass(c)) {
        $(el).animate({'bottom': 0}, duration)
            .removeClass(c);
    } else {
        $(el).animate({'bottom': '-90px'}, duration)
            .addClass(c);
    }
});
于 2013-05-23T18:18:06.417 に答える
1

最初の位置を取得 (またはハード コード) し、最初の位置にいるか更新された位置にいるかを追跡する必要があります。

$(function() {
    var shareWindow = $('#md-share-window');
    var initialPosition = shareWindow.css('bottom'); //get initial position
    var atInitialPos = true; //whether this is the initial or updated position

    $('#boxclose').on('click', function(){
        var newPosition = atInitialPos ? '-90px' : initialPosition; //determines new position
        shareWindow.animate({'bottom': newPosition}, 500);
        atInitialPos = !atInitialPos; //toggle initial position boolean
    });
});
于 2013-05-23T18:12:10.130 に答える