在Javascript中重复模式

时间:2014-08-01 03:00:55

标签: javascript arrays css3 translate-animation

我将如何重复下面的转换模式?

BoxesFx.prototype._setTransforms = function() {
    this.transforms = {
        'effect-1' : {
            'next' : [
                'translate3d(0, ' + (win.height/2+10) + 'px, 0)', 
                'translate3d(-' + (win.width/2+10) + 'px, 0, 0)', 
                'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
                'translate3d(0, -' + (win.height/2+10) + 'px, 0)', 
            ],
            'prev' : [
                'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
                'translate3d(0, ' + (win.height/2+10) + 'px, 0)',
                'translate3d(0, -' + (win.height/2+10) + 'px, 0)',
                'translate3d(-' + (win.width/2+10) + 'px, 0, 0)'
            ]
        }}}

基本上,我想要:

'translate3d(0, ' + (win.height/2+10) + 'px, 0)', 
'translate3d(-' + (win.width/2+10) + 'px, 0, 0)', 
'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
'translate3d(0, -' + (win.height/2+10) + 'px, 0)'

重复n次,我们可以说n将是3,而不是复制并粘贴3次。有没有办法复制数组?我觉得我可能会感到困惑..希望我解释得很好

1 个答案:

答案 0 :(得分:0)

只需在

之外定义数组
var translate =[
   'translate3d(0, ' + (win.height/2+10) + 'px, 0)', 
   'translate3d(-' + (win.width/2+10) + 'px, 0, 0)', 
   'translate3d(' + (win.width/2+10) + 'px, 0, 0)',
   'translate3d(0, -' + (win.height/2+10) + 'px, 0)', 
];

BoxesFx.prototype._setTransforms = function() {
    this.transforms = {
        'effect-1' : {
            'next' : translate,
            'prev' : translate
        }}}

你拥有的两个阵列是不一样的,但我假设它们可能是,因为你不能引用一个数组两次并得到两个完全不同的数组?

如果每次都需要数组的实际新副本,则可以执行

'next' : translate.slice(0)

代替