How to detect if DOM element attribute changes based on an event?
Anyone knows of a way to detect when a DOM attribute changes with jQuery?
For example, I have the following HTML code..
- <div id="ctl00_ctl00_cphMain_cphMain_upoCategories_uprProgress" style="display: none; position: absolute; z-index: 100000; width: 723px; height: 1014px; left: -50000px; top: -50000px;" role="status" aria-hidden="true" class="updateProgress">
- <div style="position: absolute; left: 353px; top: 299px;">
- <img id="ctl00_ctl00_cphMain_cphMain_upoCategories_imgUpdating" src="http://maxcdn.nexternal.com/Shared/StoreFront/Images/updating.gif" alt="Updating" style="border-width:0px;">
- </div>
- </div>
If a dropdown select value changes, this code will generate display:visible for 5 - 10 seconds, then go back to display:none.
How can I detect when the sequence is over and it turns back to display:none again?
I tried using the following function....
- $('.updateProgress').live('DOMAttrModified',function(e){
- console.log('something has changed and..'+ $(this).css('display'));
- });
But it doesn't work for me. The page I am working on has to use jQuery 1.6., which is why I am not attempting to use the .on method.
Thanks for any advice!
*Break through the ice and never look back*