Fork me on GitHub

Example: Using a Layer

This example demonstrates how to use the Layer.

HTML

<div style="position: relative; width: 800px; height: 500px;" id="layer"></div>

JavaScript

Implementation

YUI().use('layer', 'bezier-wire', 'container', 'image-container', 'json', function(Y) {

  l = new Y.Layer({
        width: 800,
        height: 500,
        render: Y.one('#layer'),
        // first container : 
        children: [
          {
            children: Y.WidgetTerminals.EIGHT_POINTS,  // terminals
            type: 'Container',
            width: 200,
            height: 100,
            xy: [500,200],
            headerContent: '9 terminals',
            bodyContent: 'bodyContent',
            footerContent: 'footerContent'
         },
         {
            children: Y.WidgetTerminals.FOUR_CORNERS,
            type: 'Container',
            width: 200,
            height: 200,
            xy: [200,250],
            headerContent: '9 terminals',
            bodyContent: 'Do this after'
          },
          {
            type: 'ImageContainer',
            children: Y.WidgetTerminals.FOUR_EDGES,
            imageUrl: 'http://www.google.fr/images/logos/ps_logo2.png',
            xy: [700,30]
          }
        ]
  });

});