views:

20

answers:

0

Hi... Can anyone tell me why this doesn't work in Safari?

var el = "#divName";

$(el).prepend($("<div id='" + id + "' style='position: absolute; top: -35px; width: 100%; height: 35px; clear: all;'></div>")
                 .data("data", o)
                 .html("<table style='width: 100%; height: 100%; position: absolute; top: 0px; left: 0px; font-family: Arial,Helvetica; font-size: 13px;' cellpadding='0' cellspacing='0'><tr style='position: absolute; top: 0px; left: 0px;'><td style='width: 35px; position: absolute; top: 1px; left: 1px; line-height: 35px;'><img src='" + originImg + "' style='height: 30px; width: 30px;' /></td><td style='position: absolute; width: 800px; height: 35px; left: 38px;'><b>" + o.from + "</b><br />"+o.text+"</td></tr></table>"));

$(el + " > div:first").animate({ top: "+=" + border }, 1000);

$(el + " > div:gt(0)").animate({ top: "+=" + border }, 1000);

$(el + " > div:gt(0)").css("border-top", "1px solid #ccc");

It works perfectly in Firefox... In Safari, the div itself moves down but the table within the div doesn't move with it. Also, the table will "pop in place" when I click a text box. Weird... Anyone wanna take a guess as to what's wrong?