Firebug lite - break on attribute change - IE

455 Views Asked by At

I'm trying to find what is changing the height/width of an attribute in IE9 only.

There is a Firebug feature "break on attribute change" https://getfirebug.com/wiki/index.php/Break_On_...

I've included the firebug-lite script in my code. https://getfirebug.com/firebuglite

But right clicking on an element in firebug lite doesn't bring up the context menu unfortunately :(

Does firebug lite support "break on attribute change"?

Or is there an alternative method?

Thanks, Russ

1

There are 1 best solutions below

0
On

Woohoo!! Found out how to display a message when the attribute changes via http://help.dottoro.com/ljdchxcl.php

<body onload="InitListener ();">
....

<script type="text/javascript">
    function InitListener () {
        var elemToCheck = document.getElementById ("objectelementid");
        if (elemToCheck.addEventListener) { 
            // all browsers except IE before version 9
            elemToCheck.addEventListener ('DOMAttrModified', OnAttrModified, false);    
            // Firefox, Opera, IE
        }
        if (elemToCheck.attachEvent) {  
            // Internet Explorer and Opera
            elemToCheck.attachEvent ('onpropertychange', OnAttrModified);   
            // Internet Explorer
        }
        console.log("events attached");
        // Test the event works
        elemToCheck.setAttribute("width","333");
        console.log("something happened");
    }

    function OnAttrModified (event) {
        var message = "";
        if ('attrChange' in event) {    
            // Firefox, Opera, Internet Explorer from version 9
            message += "Something has happened to an attribute of the " +
                            event.target.tagName + " element.\n";
            message += "The value of the " + event.attrName +
                            " attribute has been changed from "
                        + event.prevValue + " to " + event.newValue + ".";
        }

        if ('propertyName' in event) {  // Internet Explorer
            message = "The " + event.propertyName + " property of the "
                       + event.srcElement.tagName + " element has been changed.";
        }

        console.log(message);
    }
</script>

Unfortunately, the test provide futile, it seems that IE9 automatically resizes the video if there is no width or height... must be a feature... deep joy...