title: Help with jQuery Roundabout Library
body: <p>I'm about to start working on building a website. The design is in the format of content sitting behind and you click it brings it to the front. In a stack order. The design is <a href="http://apili.net/jquery/design.jpg" rel="nofollow">Here</a></p>
  
  <p>The basic concept is to follow the jQuery Roundabout idea. Buuuuuuuuut the problem I have is when HTML is added into each box, when it moves to the back it doesn't scale correctly. It keeps the same size. Ideally I'd like it to scale to match, but not having much look.</p>
  
  <p>Any ideas on how I can manage this? My example is <a href="http://apili.net/jquery/" rel="nofollow">Here</a></p>
  
  <p>Code is also here : </p>
  
  <pre><code>    &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head&gt;
  &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
  &lt;title&gt;jQuery Roundabout&lt;/title&gt;
  
  &lt;script src="js/jquery-1.5.min.js" /&gt;&lt;/script&gt;
  &lt;script src="js/jquery.roundabout.min.js" /&gt;&lt;/script&gt;
  &lt;script src="js/jquery.roundabout-shapes.min.js" /&gt;&lt;/script&gt;
  
  &lt;style&gt;
      body { font-family: Verdana, Geneva, sans-serif; }
      p { font-size: 11px; }
     .roundabout-holder { padding: 0; height: 5em; }
     .roundabout-moveable-item {
        height: 4em;
        width: 4em;
        cursor: pointer;
     }
     .roundabout-moveable-item h1 {
         font-size: 11px;
     }
     .body { width: auto !important; }
     .roundabout-in-focus { cursor: auto; }
  &lt;/style&gt; 
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;div id="container"&gt;
  &lt;div id="myRoundabout"&gt;
     &lt;div class="box"&gt;
          &lt;h1&gt;Contact events4fun&lt;/h1&gt;
          &lt;p&gt;HTML Element In Here&lt;/p&gt;
          &lt;p&gt;email : test@test.com&lt;/p&gt;
      &lt;/div&gt;
     &lt;div class="box"&gt;Box 2&lt;/div&gt;
     &lt;div class="box"&gt;Box 3&lt;/div&gt;
     &lt;div class="box"&gt;Box 4&lt;/div&gt;
     &lt;div class="box"&gt;Box 5&lt;/div&gt;
  &lt;/div&gt;
  &lt;script&gt;
     $(document).ready(function() {
        $('#myRoundabout').roundabout({
           shape: 'diagonalRingLeft',
           childSelector: 'div.box',
           minScale: 0.1,
           maxScale: 1.2
        });
     });
  &lt;/script&gt; 
  &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>Thanks in advance</p>