When you wish to 'script' the plug-in you need to access the plugin object with a javascript variable.

As a result, you must add an id parameter to both the <object> and the <embed> tags. Here we have named the <object> element "ie_plugin" since this tag is used by Internet Explorer, and we have named the <embed> element "np_plugin" because this tag is used by all Netscape-compatible browsers.

Hence, here is the code used for the plugin elements this time:

    <object id="ie_plugin" classid="clsid:67DABFBF-D0AB-41fa-9C46-CC0F21721616"
            width="320" height="212"
            codebase="http://go.divx.com/plugin/DivXBrowserPlugin.cab">

            <param name="src" value="../../videos/video1.divx" />

            <embed id="np_plugin" type="video/divx" src="../../videos/video1.divx"
                   width="320" height="212"
                   pluginspage="http://go.divx.com/plugin/download/">
            </embed>
    </object>
    

To use JavaScript calls on the plugin, you must know which of the <object> or <embed> element to reference, depending on what browser is used by the person viewing the page. Below is the code we use in this example, parsing the 'user agent' string that identifies the browser.

Since the Internet Explorer browser will always use 'MSIE' in its user agent string and Safari will always use 'Safari' in it, we discriminate on this and set a variable named 'plugin' to point to the correct element. While Safari on the Mac uses the embed tag, we must script the plug-in in Safari using the outer most element, here the object tag. Don't ask me why :)

Additionally, this code must be placed after the object and embed tags in the HTML file.

    //
    // This code detects which browser we are
    // running into (IE/Safari or others) and assigns
    // the correct element (object or embed) to
    // the "plugin" variable, that we will use.
    //

    var plugin;

    if(navigator.userAgent.indexOf('MSIE')   != -1 ||
       navigator.userAgent.indexOf('Safari') != -1)
    {
        plugin = document.getElementById('ie_plugin');
    }
    else
    {
        plugin = document.getElementById('np_plugin');
    }
    

Once this is done, you can define JavaScript functions that use the 'plugin' variable like this:

    function showPluginPreferences()
    {
        plugin.ShowPreferences();
    }
    

And call this function when a button is pressed, like this:

    <input type="button"
           value="Configure the DivX Plug-In"
           onClick="javascript:showPluginPreferences();">