≪ <

1

> ≫

states = Array({
  "screen" : {
    "style" : {
      "top": 0,
      "left": 0
    }
  },
  "mask" : {
    "style" : {
      "top": 0,
      "left": 0,
      "height": 600,
      "width": 800
    }
  },
  "textboxes" : Array(
  {
    "fixed"     : false,
    "classAttr"     : "box1",
    "style"     : {
      "top": 150,
      "left": 150
    },
    "content"   : "Nothing feels like Bépo"
  },
  {
    "fixed"     : true,
    "classAttr"     : "box2",
    "content"   : "Element 1",
    "style"     : {
      "top": 0,
      "left": 0
    }
  }
  )
},{
  "screen" : {
    "style" : {
      "top": -100,
      "left": 0
    }
  },
  "mask" : {
    "style" : {
      "top": 100,
      "left": 470,
      "height": 230,
      "width": 230
    }
  },
  "textboxes" : Array(
  {
    "fixed"     : false,
    "classAttr"     : "box1",
    "baseStyle" : {
      "top": 120,
      "left": 420
    },
    "style"     : {
      "top": 180,
      "left": 380
    },
    "finalStyle": {
      "top": 60,
      "left": 360
    },
    "content"   : "Hey, this is me !"
  },
  {
    "fixed"     : true,
    "classAttr"     : "box2",
    "style"     : {
      "top": 100,
      "left": 0
    },
    "content"   : "Element 2"
  }
  )
},{
  "screen" : {
    "style" : {
      "top": -100,
      "left": -100
    },
    "transformin" : {
      "skewX": 20
    },
    "transformout" : {
      "skewX": 0
    }
  },
  "textboxes" : Array(
  {
    "fixed"     : false,
    "classAttr"     : "box1",
    "style"     : {
      "top": 400,
      "left": 400
    },
    "baseStyle" : {
      "top": 500,
      "left": 500
    },
    "finalStyle" : {
      "top": 400,
      "left": 400
    },
    "content"   : "skewX Style !"
  },
  {
    "fixed"     : true,
    "classAttr"     : "box2",
    "style"     : {
      "top": 100,
      "left": 100
    },
    "content"   : "Element 3"
  }
  )
},{
  "screen" : {
    "style" : {
      "top": -600,
      "left": -300
    }
  },
  "textboxes" : Array(
  {
    "fixed"     : false,
    "classAttr"     : "box1",
    "style"     : {
      "top": 1100,
      "left": 800
    },
    "baseStyle" : {
      "top": 1200,
      "left": 700
    },
    "content"   : "Look at the footer"
  },
  {
    "fixed"     : true,
    "classAttr"     : "box2",
    "style"     : {
      "top": 600,
      "left": 300
    },
    "content"   : "Element 4"
  }
  )
},{
  "screen" : {
    "style" : {
      "top": -1800,
      "left": 300
    },
    "transformin" : {
      "scale": 3
    },
    "transformout" : {
      "scale": 1
    }
  },
  "textboxes" : Array(
  {
    "fixed"     : false,
    "classAttr"     : "box1",
    "style"     : {
      "top": 2100,
      "left": 100
    },
    "baseStyle" : {
      "top": 2300,
      "left": -200
    },
    "content"   : "Over there !
I used to be in love for animated GIFs"
  },
  {
    "fixed"     : true,
    "classAttr"     : "box2",
    "style"     : {
      "top": 1800,
      "left": -300
    },
     "content"   : "Element 5"
 }
  )
});