Class Attribute Demo

This demo features the class binding property. This property is responsible for binding a value to the className property of a DOM element. It is interchangeable with the property className. The class property is a shortcut. As seen in the demo, you can use this property to bind the class of an element to a value on a Lava Object. Note that this binding property overwrites any existing class on the element.
<script type="text/javascript">
    var model = Lava.Object({
        className: '',
        label: 'Hover over me!',
        hover: function () {
            model.className = 'hover';
            model.label = 'Click me!';
        },
        normal: function () {
            model.className = '';
            model.label = 'Hover over me!';
        },
        click: function () {
            model.className = 'click';
            model.label = 'Cool!';
        }
    });
</script>

<div data-bind="{class: model.className, mouseover: model.hover, mouseout: model.normal, click: model.click, text: model.label}"></div>