1

我有以下代码用于解决我遇到的这个问题。它适用于 IE9/Chrome：

    $(document).ready(function () {
        var legendWidth = $('#titleInner').outerWidth();
        var margin = 'calc((100% - ' + legendWidth + 'px) / 2)';
        $('#titleInner').css('margin-left', margin);
        $('#titleInner').css('margin-right', margin);
    });

但是，我想摆脱CSS calc() 函数，以便它在 IE7/8 中工作。

我已经看到这个问题/答案使用 jQuery 进行计算，这似乎是一个很好的解决方案。

问题是我无法让语法/链接工作。

这是我尝试过的：

    $(document).ready(function () {
        var legendWidth = $('#titleInner').outerWidth();
        $('#titleInner').css('margin-left', '100%').css('margin-left', '-' + legendWidth + 'px').css('margin-left', '/2');
        $('#titleInner').css('margin-right', '100%').css('margin-right', '-' + legendWidth + 'px').css('margin-right', '/2');
    });

我尝试了一些变体（删除“px”等），但没有运气。我也无法弄清楚如何添加括号以跨多个链元素限定 '/2' 。

那么，任何人都可以帮助 jQuery 等价于var margin = 'calc((100% - ' + legendWidth + 'px) / 2)';吗？

4

1 回答 1

0

这可能有效：

$(document).ready(function () {
    var legendWidth = $('#titleInner').outerWidth();
    var legendParentWidth = $('#titleInner').parent().outerWidth();
    var margin = (legendParentWidth - legendWidth) / 2;
    $('#titleInner').css('margin-left', margin + 'px');
    $('#titleInner').css('margin-right', margin + 'px');
});

或使用链接：

$(document).ready(function () {
    var legendWidth = $('#titleInner').outerWidth();
    $('#titleInner').css('margin-left', '100%').css('margin-left', function(){
        return (($('#titleInner').css('margin-left') - legendWidth) / 2) + 'px';
    });
    $('#titleInner').css('margin-right', '100%').css('margin-right', function(){
        return (($('#titleInner').css('margin-right') - legendWidth) / 2) + 'px';
    });
});
于 2013-05-27T06:23:52.980 回答