Bkgrd Image Displaying Corrupted

[alfred3x]

So, based on Izzy's sage advice, I've gotten my Apache running well on my WinXP Home laptop. I'm currently redesigning my website on my desktop, but thought I'd copy it onto the laptop for when I'm on the road (which includes being upstairs while watching TV). But the masthead image comes up corrupted: the top half displays OK, but the bottom either displays in grey, or has strange effects.

I recopied the JPG from the main workstation, but still no go.

I viewed the image through Paint Shop Pro (v 9) and it's fine.

I viewed the image through the browser, directly from the disk, and it's fine as well.

So the problem seems to stem from looking at it through Apache. (I also checked it out using IE as opposed to FF: same issues.)

Could it be a MIME issue?

Since it worked on my desktop, I copied the httpd.conf file from there onto the laptop and adjusted using WinMerge (great file and directory program, btw. and free!), but still no go.

Any help appreciated!

- AAA

[Izzy]

Is your html image tag the same size as your image?

Code: Select all

<img src="images/your.jpg" width="100" height="50" alt="some text">

The your.jpg is 100x50.
If your.jpg is 200x100 and the tag is 100x50 then it may cause your problem but not always. Worth checking that first.

Always resize images in an image editor before using them on the web and rather than changing the size using the img tag. Not all images will corrupt in this way but some do.

Do any other images on your web site appear corrupted?

Another point to check is if the image is contained within an iframe or a table cell that is sized but the image does not fit the constraints of the container. This may have a corrupted appearance.

In other words check your html,screen resolutions and container sizes will fit the image in. Another check is to do with images repeating to fill a large space like a background. Just off the top of my head I seem to recall that an image for a background will do strange things if the image size will not fit the screen resolution. Worth looking into also.

For instance if a style sheet is used for a background image then there are all sorts of combinations of effect that can be used for example:

Code: Select all

style="background-image: url('imagesmisc/headers.jpg'); background-repeat: no-repeat; background-attachment: fixed; background-position: center">

Good luck with it.