Welcome to WebmasterWorld Guest from 54.160.221.82

Forum Moderators: phranque

Message Too Old, No Replies

Better Way for Repeating Images

     
8:36 pm on Jul 9, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 26, 2004
posts:776
votes: 0


I am working on a project for a client where I am using a repeating background image with a pattern to it. The pattern is water droplets of different sizes scattered in a random look.

The client doesn't like the way you can see where the images touch each other when they start repeating. You can see it, but I am not sure if there is a better way to correct it.

I have a page set up in a fixed width CSS position. I use another CSS tag to create a repeat image in the main content block and then just dump the text over it. However as the client notes you can clearly see where the image starts repeating.

Does anyone have any suggestions how to handle this design issue a better way when you don't know how tall the final page will be and therefore, must repeat the image.

8:55 pm on July 9, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Jan 29, 2002
posts:980
votes: 0


You could create a seamlessly tiling image, so that when the image is repeated the pattern just continues without any visible breaks (like patterned wallpaper).

PaintShopPro has a tool for doing this I think, and there are tutorials on the web for other apps. The only other alternative is to use a massive image. Or change the design... ;) HTH

12:41 am on July 10, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 8, 2005
posts:833
votes: 0


I use Paint Shop Pro, too, but I think just about any image editing program can make seamless tiles. Or look on some of the many sites that offer tiling backgrounds for free download - random water droplets is a classic and shouldn't be hard to find.
1:27 am on July 10, 2008 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Apr 26, 2004
posts:776
votes: 0


seamlessly tiling image, so that when the image is repeated the pattern just continues without any visible breaks

Thanks! I haven't heard of this method before. I don't do a ton of graphic design, typically just enough to be dangerous. I did a quick Google search and found a bunch of tutorials. This will solve a thorn in my designs I have had for a while.