Hello I am creting a wordpress website. My website: http://www.decorareprojetar.com.br/ My client said: the middle divs are ok, but don't give them a set witdh. Instead just let them be, give them a margin right to get the with spacing. Images need to be resaved as black and white / side by side with color, so on mouse over I just slide the background position instead of changing the source of the image (which results in a flicker. How can I do this? Thanks.
You mean why it flickers? I think that's because you're still changing the (background) source, not repositioning/ sliding it.
So I think this is a sprite image job. But I dont know how can I do it exactly. I am tring to create divs and using hover for oher source image. Do you have advice for css?
Hi. "CSS sprites" is not hard to make. Just google it and you'll find various techniques In your case (for the div#second as an example) you could combine: Ornatto_14.jpg + af2.jpg to be one single image say Ornatto_14_af2.jpg. This is now the new background for div#second. One way to arrange them is side by side, so the new dimension for new image is now 126x405 pixels, right? So the CSS rule for this div#second should be like: div#second{ ... backgrond-position: 0px 0px; } div#second:hover{ ... backgrond-position: -63px 0px; } Code (markup): I hope this is easy to be implemented in WP cause I don't know a bit about it Hendra