Launching autoHeight on Document Ready

Edit the src attribute in the script tag to point to your copy of opensocial-jquery.autoHeight.js. Inside the ready event, add the autoHeight method to window object:

<script type="text/javascript" src="opensocial-jquery.js"></script>
<script type="text/javascript" src="opensocial-jquery.autoHeight.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $(window).autoHeight();
});
</script>

You can download your own copy of plugin from the Downloads page.

Featured Video

Complete Example

<?xml version="1.0" encoding="UTF-8"?>
<Module>
<ModulePrefs title="OpenSocial jQuery autoHeight Test Suite">
<Require feature="dynamic-height" />
</ModulePrefs>
<Content type="html" view="canvas"><![CDATA[
<script type="text/javascript" src="opensocial-jquery.min.js"></script>
<script type="text/javascript" src="opensocial-jquery.autoHeight.js"></script>
<script type="text/javascript">
$(document).ready(function() {
  $(window).autoHeight();
});
</script>
<h1>OpenSocial jQuery autoHeight Test Suite</h1>
<pre>
$(document).ready(function() {
  $(window).autoHeight();
});
</pre>
<form onsubmit="$('p').css('font-size',this.fs.value);return false;">
<select name="fs">
<option value="">font-size:</option>
<option value="16px">16px</option>
<option value="32px">32px</option>
<option value="48px">48px</option>
<option value="64px">64px</option>
<option value="72px">72px</option>
<option value="96px">96px</option>
</select>
<input type="submit" value="Apply" />
</form>
<p>
OpenSocial jQuery is jQuery based concise JavaScript Library
for rapid OpenSocial Apps development. OpenSocial jQuery autoHeight
is plugin to adjust height of Gadgets automatically all the time.
</p>
]]></Content>
</Module>