1

正如你所看到的，左边有一个滑动，同时从 100% 减少到 0。

我想得到同样的效果，但从左到右。

我做错了！

jQuery('#target').animate({ width: '0', left: '-25%' }, 1500, 'swing');

小提琴示例：http: //jsfiddle.net/RsBNk/

4

2 回答 2

2

这很简单。将图像向右对齐，然后使用 jQuery 将其减小 25%，如下所示：

jQuery：

jQuery('#target').animate({ width: '0', right: '-25%' }, 1500, 'swing');

CSS：

.box {
    width: 100%;
    position: absolute;
    top: 0;
    right: 0; /* Modified this line */
    height: 200px;
    background-image: url('http://images.icnetwork.co.uk/upl/uxbridgegazette/jul2012/0/4/marc-mccarroll-image-2-304314157.jpg');
    background-position: right; /* EDIT: This property needs to be set */
}

更新的演示

于 2013-09-25T15:52:29.930 回答
0

可能这对你有帮助

$('#target').animate({
    width : '0',
    marginLeft: parseInt($('#target').css('marginLeft'),10) == 0 ?
        $('#target').outerWidth() : 0
}, 1500, 'swing');

检查演示

于 2013-09-25T15:42:54.100 回答