i have this markup
<div class="pfbc-form" id="ticker_div" style="padding: 0px; line-height: 18px; width: 64%; margin-top: 0px; margin-left: 10px;">
<span id="ticker"><b> Avisos y tratamientos vigentes.</b></span>
</div>
<input class="ui-button ui-widget ui-state-default ui-corner-all" style="height: 40px;width: 10%;" value="something" type="button" onclick="doSomething();"></input>
and this js:
var array_datos = ['foo','bar'];
var i = 1;
function blink()
{
var elem = $( "#ticker" );
//elem.hide( 'clip', {}, 7000/5);
elem.text(array_datos[i]);
elem.show( 'clip', {}, 7000/5);
if(i+1<array_datos.length)
i++;
else
i = 1;
}
blink();
var timer = setInterval('blink()',7000);
</p>
this code works in all browsers, except for IE 7. when the .show runs, the button moves down, and returns to its position when the animation ends.
i tried setting a height to the divs, but that doesnt seem to work. i have no clue of what its happening.
ps: i know that there are a couple of problems in that code but i dont think that affects this behavior.