css-$12.lzx

<canvas height="220" width="100%">

  <stylesheet>

    #sun {
      bgcolor: #16355E;
      face: "resources/smiley.gif";
    }

    #monarchs {
      bgcolor: #B2B9CB;
      face: "resources/sourface.png";
    }

  </stylesheet>

  <simplelayout axis="x" spacing="10"/>

  <class name="bouncebox">
    <view name="outer" x="0" y="0" width="200" height="200" bgcolor="$style{'bgcolor'}">
      <view name="inner" x="50" y="50" bgcolor="0xFFFFFF" width="${immediateparent.width-100}" height="${immediateparent.height-100}"/>
      <view name="gBounce" source="$style{'face'}" x="50" y="50">
        <animatorgroup name="myAnimatorGroup" start="true" process="sequential">
          <animator attribute="y" from="50" to="150" duration="1000" motion="linear"/>
          <animator attribute="y" from="50" to="100" duration="1000" repeat="Infinity" motion="easeout"/>
        </animatorgroup>
      </view>
    </view>
  </class>

  <bouncebox id="monarchs"/>
  <bouncebox id="sun"/>

</canvas>
<!-- * X_LZ_COPYRIGHT_BEGIN ***************************************************
     * Copyright 2007, 2008 Laszlo Systems, Inc.  All Rights Reserved.                   *
     * Use is subject to license terms.                                            *
     * X_LZ_COPYRIGHT_END ****************************************************** -->