In IE, when I use the pulsate effect after an insertBefore or insertAfter, the html and/or hover gets messed up. same exact code works fine in firefox.
THE ISSUE is before you push the pulsate button, as you hover over the rows, ANYWHERE on the row, the XXX shows up on the right side of the table in both browsers. After you push pulsate, the XXX only shows up in IE as you hover over the text on the left, not the rest of the row/ white space. Can someone help me fix my code, work around the issue, or explain if it is a bug in the effect? <script type="text/javascript" src="jquery-1.3.2.js"></script> <script type="text/javascript" src="jquery-ui-1.7.1.custom.min.js"></ script> <script language="javascript"> $().ready( function() { // setup the hover image for the move arrows var fieldsList = $('li[id^=row_]'); $.each(fieldsList, function() { $(this).hover( function() { id = $(this).attr('id').substring ('row_'.length); $('#x_'+id).show(); }, function() { id = $(this).attr('id').substring ('row_'.length); $('#x_'+id).hide(); } ); }); }); function doPulsate() { $('#row_4444').effect("pulsate", { times:2 }); } </script> </head> <body> <ul id="idDEFAULTSelectedFields" style="width: 200px; border: 1px solid black"> <li id="row_123"> <a id="x_123" style="display: none; float: right; padding-right: 3px" href="#" onclick="return false;">XXX</a> Address 1: </li> <li id="row_4444"> <a id="x_4444" style="display: none; float: right; padding-right: 3px" href="#" onclick="return false;">XXX</a> Address 2: </li> <li id="row_678534"> <a id="x_678534" style="display: none; float: right; padding- right: 3px" href="#" onclick="return false;">XXX</a> Address 3: </li> </ul> <input value="Do Pulsate" type="button" onclick="doPulsate();" />