[jQuery] Using .center() with Image Crossfade
John,
Thanks for the reply.
Its all very odd at the moment. Changing the a and img rules to both be
position:absolute; does fix the problem, but only once you do a hard refresh
after the page has loaded. On first load, the images are anchored top left.
I've toyed about with changing the position rules for the a/img elements, but
with no luck. I'm guessing is something to do with the center() method.
I've tried centering manually:
$("#imageContainer img").each(function(){
var w = this.width;
var h = this.height;
if( w < 250 )
{
$(this).css("margin-left", ( ( 250 - w ) / 2) + "px");
$(this).css("margin-right", ( ( 250 - w ) / 2) + "px");
}
if( h < 250 )
{
$(this).css("margin-top", ( ( 250 - h ) / 2) + "px");
$(this).css("margin-bottom", ( ( 250 - h ) / 2) + "px");
}
$(this).css("position", "absolute");
$(this).css("top", "0");
$(this).css("eft", "0");
});
But on loading this anchors the top=left of the image centered to the
containing
a element, floating the images outside of the container and over other
content.
Any ideas on how to fix it?
Quoting discuss-request@jquery.com: