Javascript 抽屉滑块

Question

尝试检查位置固定元素的宽度。单击菜单图标容器后，抽屉的宽度应从 0% 增加到 18%。如果单击文档的正文，抽屉应该关闭，但仅当抽屉的宽度为 18% 时。当我尝试将抽屉的宽度记录到控制台时，我得到了 0px，即使结果是在抽屉展开后记录的。有人知道我错过了什么吗？

$("#menu-icon-container").click(function(){
    $("#drawer-menu-wrapper").animate({width:'18%'},'fast');
    $("#drawer-home-text").text("Home");
    $("#drawer-products-text").text("Products");
    $("#body-wrapper").css("opacity","0.5");
    console.log($("#drawer-menu-wrapper").css("width"));
});
$("#close-icon-container").click(function(){
    $("#drawer-menu-wrapper").animate({width:'0%'},'fast');
    $("#drawer-home-text").text("");
    $("#drawer-products-text").text("");
    $("#body-wrapper").css("opacity","1");
});
$("#body-wrapper").click(function(){
    if ($("#drawer-menu-wrapper").css("width")!="0px"){
        $("#drawer-menu-wrapper").animate({width:'0%'},'fast');
        $("#drawer-home-text").text("");
        $("#drawer-products-text").text("");
        $("#body-wrapper").css("opacity","1");
    }
});

Answer 1

正如 Gone Coding 提到的：

$("#menu-icon-container").click(function(){
    $("#drawer-menu-wrapper").animate({width:'18%'},'fast',function(){
       console.log($("#drawer-menu-wrapper").css("width"));
    });
});