Hi all,

I would like to add a fixed image in a web page, I was able to add a fixed background image, but I don't want it to be a background, I need it as an img tag, because of two reasons:
1. I want add a link to that image
2. I want to display it over other element when the scroll move, not behind them.

any ideas using CSS, HTML or Javascript??

**to add a fixed background, use the following code:

.fixed_bg
{
background-attachment: fixed;
background-image: url(image.gif);
background-repeat: no-repeat;
background-position: bottom right;
}

Here's one I did a while back:


#leaf {
position: fixed;
left: 0px;
bottom: 0px;
height: 135px;
width: 200px;
background: url(../images/leaf.gif) bottom left no-repeat;
z-index: 0;
}

<div id="leaf"/>


I just used a background style attribute to show the image in the div, but you could just as easily put an IMG tag in the div as well.

Hi,

image still appears behind other elements, and it is not fixed in the page, if we move the scroll, the image moved with it, I need it to be displayed in the bottom right of the page always (even if the customer scroll in the page, the image should still appears).