jquery - 仅右侧的兄弟姐妹或使用 $(ID).something.$(ID2).something 或 next()

Question

我有一个这样的html布局：-

<div id="left-column" style="200px"></div>
<div id="center-column"></div>
<div id="right-column"></div>

在左栏中，我有一些与以下功能的链接，一个用于增大中心列，另一个用于缩小它。

眼下：-

OPTION 1 does both left and right columns

OPTION 2 works but throws an error in IE SCRIPT438: Object doesn't support property or method '$' which refers to the .$('#right....

OPTION 3 works growing but does not shrinking

有什么想法吗？

谢谢

//GROWING
//OPTION 1:
    $('#center-column').animate({ width: '0px' }, 500).siblings().animate({ 'width': ($(window).width() - cLeft) + 'px' });
//OPTION 2:
    $('#center-column').animate({ width: '0px' }, 500).$('#center-column').animate({ 'width': ($(window).width() - cLeft) + 'px' });
//OPTION 3:    
$('#center-column').animate({ width: '0px' }, 500).next().animate({ 'width': ($(window).width() - cLeft) + 'px' });

//SHRINKING
        var rightwidth = $(window).width() - (cCenter + cLeft + cMargin);
//OPTION1
        $('#center-column').animate({ width: cCenter + 'px' }, 500).next().animate({ 'width': rightwidth + 'px' });
//OPTION2
        $('#center-column').animate({ width: cCenter + 'px' }, 500).siblings().animate({ 'width': rightwidth + 'px' });
//OPTION3:
        $('#center-column').animate({ width: cCenter + 'px' }, 500).$('#right-column').animate({ 'width': rightwidth + 'px' });

Answer 1

//GROWING
    //OPTION 2:
        $('#center-column').animate({width: '0px'}, 500, function() {
            $('#center-column').animate({'width': ($(window).width() - cLeft) + 'px'});
        });

//SHRINKING
    //OPTION3:
        $('#center-column').animate({width: cCenter + 'px'}, 500, function() {
            $('#right-column').animate({'width': rightwidth + 'px'});
        })