Jquery fadeOut looking different in FF than in Chrome/Safari

Posted by StealthRT on Stack Overflow See other posts from Stack Overflow or by StealthRT
Published on 2010-04-26T00:03:01Z Indexed on 2010/04/26 0:03 UTC
Read the original article Hit count: 491

Filed under:
|
|

Hey all, i have a page that when a user desides to delete a company, it fades out using the jquery fadeOut() command. This works great and does as it should in FireFox but for some reason it doesn't do the same in Chrome/Safari browsers.

The problem is that i have a png image overlay on top of the company logo image that also fades out with the company logo. But if there are more than one company logo on the page, it moves the others in the place where the one got deleted.

Like i said, it works fine (and as it should) in Firefox and even IE (SHOCK!) but not in Chrome or Safari. This is the code i use to delete (fade out) the section:

 $('#moreInfoM' + theNum).fadeOut("slow");
 $('#moreInfo' + theNum).fadeOut("slow");
 $('#liNum' + theNum).fadeOut("slow");

Where moreInfoM, moreInfo & liNum are all within the code for each logo image. TheNum is just a unique number for each logo just for reference.

And the ASP code:

 For iLoop = LBound(compNames) to UBound(compNames)
theWidth = (iwidth / 2)
ImgDimension(Server.MapPath("img/company/" & compNames(iLoop) & ".jpg"))
theWidth = (iwidth / 2)

response.write "<li onClick=""$('#moreInfo" & y & "').slideToggle('slow');"" id=""liNum" & y & """>" & vbcr         

if theBrowser = "chrome" or theBrowser = "safari" then
     response.write "<img src=""img/clickMI.png"" width=""97"" height=""33"" style=""position:absolute;width:97px;height:33px;z-index:12;padding-top: 54px; padding-left:" & theWidth & "px;"">" & vbcr
else
     response.write "<img src=""img/clickMI.png"" width=""97"" height=""33"" style=""position:absolute;width:97px;height:33px;z-index:12;padding-top: 50px; padding-left:" & theWidth & "px;"">" & vbcr
end if

response.write "<img src=""img/company/" & compNames(iLoop) & ".jpg"" height=""60"" style=""border: 1px solid #4C3C1B;padding: 2px;background-color: #CCC; margin-left: 10px; margin-right: 10px; margin-bottom: 5px; margin-top: 5px;"" id=""moreInfoM" & y & """ />" & vbcr
response.write "</li>" & vbcr
y = y + 1
 Next

I have made a video of FF and Chrome to give you a better understanding.

http://www.youtube.com/watch?v=ZQaRvosvRKE

Thanks!

David

© Stack Overflow or respective owner

Related posts about jQuery

Related posts about asp-classic