In order to access this site you need to enable JavaScript!

You are here: Reference > JavaScript > client-side > style handling > properties > browser specific extensions > MozBinding

MozBinding style property

Browser support:

Sets or retrieves the URL of the XBL (Extensible Binding Language) file containing the binding.

To delete the binding, first remove the rule that contains the binding from its parent styleSheet, then refresh the element by removing (removeChild) and re-appending (appendChild or insertBefore) it to its parent node.

Syntax:

object.MozBinding;

You can find the related objects in the Supported by objects section below.

This property is read/write.

CSS page for this property: -moz-binding

Possible values:

The type of this property is string.

One of the following values:

url(URI)

Where URI specifies the location of the XBL file.

inherit

Takes the value of this property from the computed style of the parent element.

none

Do not bind anything for this element.

Default: none.

Example HTML code 1:

This example illustrates the use of the -moz-binding property:

Code

somexbl.xml

<head>
    <style>
        #bindingTest {
            -moz-binding : url("somexbl.xml#alert-it");
        }
    </style>
</head>
<body>
    Move your mouse over <b id="bindingTest">this text</b>.
</body>

<?xml version="1.0" encoding="utf-8"?>
<bindings xmlns="http://www.mozilla.org/xbl">
    <binding id="alert-it">
        <content>
            <children />
        </content>
        <handlers>
            <handler event="mouseover" action="alert('Binding ok');"/>
        </handlers>
    </binding>
</bindings>

Copy Code

Preview

Syntax Highlighter

Did you find this example helpful? yes no

Example HTML code 2:

This example illustrates the use of the MozBinding property in JavaScript:

Code

somexbl.xml

<head>
    <style>
        #bindingTest {
            -moz-binding : url("somexbl.xml#alert-it");
        }
    </style>
    <script type="text/javascript">
        var binding = true;
        function GetBinding () {
            var sheet = document.styleSheets[0];
            var rules = sheet.cssRules ? sheet.cssRules : sheet.rules;
            alert (rules[0].style.MozBinding);
        }
    </script>
</head>
<body>
    <b id="bindingTest">Move your mouse over this text</b>.
    <button onclick="GetBinding ();">Get Binding</button>
</body>

<?xml version="1.0" encoding="utf-8"?>
<bindings xmlns="http://www.mozilla.org/xbl">
    <binding id="alert-it">
        <content>
            <children />
        </content>
        <handlers>
            <handler event="mouseover" action="alert('Binding ok');"/>
        </handlers>
    </binding>
</bindings>