Question

有人可以帮我用jquery正确添加calc宽度吗？或者也许是jquery中动态宽度比应用css3 calc宽度更好的选择？

var calc = "calc(100% - 270px)";

$(".two").focus(function () {
    $('.one').animate({ width: "85px" });
    $(this).animate({ "width": calc + "px" });
});

http://jsfiddle.net/N6vaj/1/

如果您需要更多说明，请与我们联系。感谢〜

Answer 1

在javascript中calc(100% - 270px)大致等于获取父元素的宽度（100％）并减去270

$(this).parent().width() - 270;

让你有这个

$(".two").focus(function () {
    var w = $(this).parent().width() - 270;

    $('.one').animate({ width: "85px" });
    $(this).animate({ "width": w });
});

FIDDLE

要使它适用于所有这些，你可以

var inputs = $(".one, .two, .three");

inputs.on('focus', function () {
    var w = $(this).parent().width() - 270;

    inputs.not(this).animate({ width: "85px" });
    $(this).animate({ "width": w });
});

FIDDLE

用jquery设置宽度calc

1 个答案: