beta

nimbb

Tutorial: Update player size dynamically

Let's start doing some fun stuff using JavaScript! Nimbb Player is fully scriptable using JavaScript functions and events inside the HTML page. This means that we can change settings dynamically, like the size of the player.

Example

normal small mini

HTML code

<script language="JavaScript" type="text/javascript">
<!--

// Set size of Nimbb Player.
function setSize(width, height)
{
  // Get a reference to the player.
  var nimbb = document["nimbb"];

  // Set size.
  nimbb.width = width;
  nimbb.height = height;
}

// -->
</script>

<a href="javascript:setSize(320,240);">normal</a>
<a href="javascript:setSize(160,120);">small</a>
<a href="javascript:setSize(100,75);">mini</a>

<object id="nimbb" classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="320" height="240" codebase= "http://fpdownload.macromedia.com/get/flashplayer/current/swflash.cab">
<param name="movie" value="http://player.nimbb.com/nimbb.swf?guid=XXXXXXXXXX&lang=en" />
<param name="allowScriptAccess" value="always" />
<embed name="nimbb" src="http://player.nimbb.com/nimbb.swf?guid=XXXXXXXXXX&lang=en" width="320" height="240" allowScriptAccess="always" pluginspage="http://www.adobe.com/go/getflashplayer">
</embed>
</object>

The code in blue is client-side JavaScript. A function setSize() is defined in which we get a reference to the nimbb object and set its size. The function is called when clicking a link.