positioning an image over a frame or iframe?

**kasei** · 09-11-2007, 05:20 PM

Hi,

I want to position an image over a frame or iframe so that the contents of the frame/iframe can move up and down, back and forth, but the image doesn't.

Anyone know how I can I do this?

Thanks!

Joe

**boogyman** · 09-11-2007, 05:50 PM

if you put an image over the frame/iframe whatever image you put there will hide whatever is in the content of the frame, unless the image itself has opacity set to allow transparency. if this is truly what you want, then you need to use some absolute / fixed css positioning on the image.

Code:

<style type="text/css">
img#overlap {
      postion: fixed;
      top: 100px;
      left: 100px;
}
<img id="overlap" width="100" height="100" alt="overlap image" title="overlap image">

I am guessing what you are attempting to do is create an image that will sit fixed behind ? a frame so that the image stays the same while the user can still see the content in the foreground ?

Code:

<style type="text/css">
iframe#whatever {
        background: #000 url('/path/to/file.extension') no-repeat fixed center;
}
</style>

<iframe id="whatever" src="something.htm">

**kasei** · 09-12-2007, 02:33 AM

Originally Posted by boogyman

I am guessing what you are attempting to do is create an image that will sit fixed behind ? a frame so that the image stays the same while the user can still see the content in the foreground ?

Thanks

I have a frame that moves around every time a viewer clicks on a link, but I want an image (a dot or something) to indicate where the user is.

I've been reloading the page each time and using PHP to create the dot inside the page, but I thought it would be smoother and faster to overlay the frame with a transparent and immobile image with a dot and have the frame move around under it using bookmarks instead of reloading.

**kasei** · 09-12-2007, 03:16 AM

This is what I got so far:

Code:

<html>
<head>
<style type="text/css">
frame#frame6 {
        background: #000 url('/images/overlay.gif') no-repeat fixed center;
}
</style>
</head>
<frameset rows="*" cols="*">
<frame src="frames/frame6.php" name="frame6" class="frame6">
</frameset>
</html>

Doesn't seem to work. What did I do wrong?

Thread: positioning an image over a frame or iframe?

Thread Tools

Search Thread

positioning an image over a frame or iframe?

Bookmarks

Bookmarks

Posting Permissions