Javascript jquery中的文本效果

我创建了带有文本效果的通知栏，一切看起来都很好，但当我添加文本效果时，如从左向右移动，第一次时它似乎有效，之后它看起来像这样，请参见

 jQuery('.text').animate({
                'right': '300px'
            }, 'slow', 'linear').animate({
                'left': '300px'
            }, 'slow', 'linear').animate({
                'left': '0',
                'right': '0',
            });

第二次单击“展开”时，当我刷新页面时，它会从中间向右显示，这是第一次正确显示

是否有一种方法可以在我打开吧台时，从左到右到中间显示信息

提前谢谢

jQuery('.text').animate({
                'right': '300px',
            }, 'slow', 'linear').animate({
                'left': '300px'
            }, 'slow', 'linear').animate({
                'left': '0',
                'right': '0',
            });
    jQuery('.text').css('right', 'auto')
    jQuery('.text').css('left', 'auto')
});

工作演示：（注意：此演示有部分功能，您只需显示您错过的内容，以检查并单击横幅）