トグルに基づいてクラスを削除/追加する

Question

click機能で左にスライドする列があります。次に、列が滑って幅が変更されるように、コンテナにwのクラスを追加します。私がしようとしているのは、wのクラスを、toggleの関数でラップして取り除いても、そのクラスを取り除くときにのクラスを追加しますが、コンテナにはまだwのクラスが含まれていて、e 。思考？

FIDDLE： http://jsfiddle.net/QDUQk/1926/

.container { 
    border: 1px solid #000; 
    width: 200px; 
} 

.container.e { 
    width: 80%; 
} 

.container.w { 
    width: 100%; 
} 

<div class="togl">Menu</div> 
<div class="col"> 
    SLIDE ME SLIDE ME PLX PLX 
</div> 
<div class="container"> 
</div> 

$('.togl').click(function() { 
    if ($('.container').is(':visible')) { 
    $('.col').toggle('slide', { 
     direction: 'left' 
    }, 1000, function() { 
     $('.container').addClass('w'); 
     $('.container').removeClass('e'); 
    }); 
    } else { 
    $('.col').toggle('slide', { 
     direction: 'left' 
    }, 1000, function() { 
     $(".container").removeClass('w'); 
     $(".container").addClass('e') 
    }); 
    } 
}); 

Answer 1

.containerの視認性がtrueから変更されません。 .is()

$('.togl').click(function() { 
    if (!$('.container').is('.w')) { 
    $('.col').toggle('slide', { 
     direction: 'left' 
    }, 1000, function() { 
     $('.container').addClass('w'); 
     $('.container').removeClass('e'); 
    }); 
    } else { 
    $('.col').toggle('slide', { 
     direction: 'left' 
    }, 1000, function() { 
     $(".container").removeClass('w'); 
     $(".container").addClass('e') 
    }); 
    } 
}); 

jsfiddle http://jsfiddle.net/QDUQk/1927/

Answer 2

あなたのコンテナの可視性はクリックで変更しないで"w"classNameを確認してください。以下を試してみて、

$('.togl').click(function() { 
    if ($('.container').hasClass('e')) { 
     $('.col').toggle('slide', { 
         direction: 'left' 
     }, 1000, function() { 
    $('.container').addClass('w'); 
    $('.container').removeClass('e'); 
    }); 
} else { 
$('.col').toggle('slide', { 
    direction: 'left' 
}, 1000, function() { 
    $(".container").removeClass('w'); 
    $(".container").addClass('e') 
}); 
}});