Bizarre IFrame problem - HTML forum at WebmasterWorld - WebmasterWorld

Forum Moderators: open

Message Too Old, No Replies

Bizarre IFrame problem

IFrame Oddity that's driving me mad

sockboy79

10:42 pm on Apr 8, 2004 (gmt 0)

10+ Year Member

I have a problem with an IFrame that I am using to display some banners, which I can't for the life of me work out.

There are a few pages within the IFrame, all using the same code except for different images on each of the page. Everything seems fine when I test it on my pc, but when I moved the pages online the images on the first page do not appear in either IE or Netscape. The images on the other pages appear though, which is perplexing me, as there is no essential difference in the code. Does anybody know a possible reason for this?

Cheers.

tedster

6:09 am on Apr 9, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

There is something different -- that you can be sure of.

Have you made sure those missing images are actually on the server and in the right directory?

sockboy79

10:24 am on Apr 9, 2004 (gmt 0)

10+ Year Member

Thanks for that. I've checked - everything is where it should be. Like I said, the code is identical aprt from the image names and positions. One of my mates checked it on Safari and it worked mine, which has confused me further. Here is the code.

Exhibit A, which wont display

<body bgcolor="#ff0066">

<img
src="images/88x31pixelsubheading01.gif" alt="88 x 31 pixel banners"
style="z-index: 1; position: absolute; left: 5px; top: 0px" />
<img
src="images/tmbanner_88x31_01.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 30px" />
<img
src="images/tmbanner_88x31_02.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 80px" />
<img
src="images/tmbanner_88x31_04.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 129px" />
<img
src="images/tmbanner_88x31_03.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 30px" />
<img
src="images/tmbanner_88x31_05.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 80px" />
<img
src="images/tmbanner_88x31_06.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 129px" />
<img
src="images/tmbanner_88x31_07.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 30px" />
<img
src="images/tmbanner_88x31_08.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 80px" />
<img
src="images/tmbanner_88x31_09.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 129px" />
<div style="position: absolute; left: 5px; top: 170px; background-color: #ff0066; width: 426px; height: 20px; text-align: right; ">
<p>page >> <a class="downloadlink" href="bannermenu01.html">1</a> � <a class="downloadlink" href="bannermenu02.html">2</a> � <a class="downloadlink" href="bannermenu03.html">3</a> � <a class="downloadlink" href="bannermenu04.html">4</a></p>
</div>

</body>

Exhibit B, which does

<body bgcolor="#ff0066">

<img
src="images/120x60pixelsubheading01.gif" alt="120 x 60 pixel banners"
style="z-index: 1; position: absolute; left: 5px; top: 0px" />
<img
src="images/tmbanner_120x60_01.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 14px; top: 30px" />
<img
src="images/tmbanner_120x60_02.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 14px; top: 100px" />
<img
src="images/tmbanner_120x60_03.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 158px; top: 30px" />
<img
src="images/tmbanner_120x60_04.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 158px; top: 100px" />
<img
src="images/tmbanner_120x60_05.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 302px; top: 30px" />
<img
src="images/tmbanner_120x60_06.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 302px; top: 100px" />
<div style="position: absolute; left: 5px; top: 170px; background-color: #ff0066; width: 426px; height: 20px; text-align: right; ">
<p>page >> <a class="downloadlink" href="bannermenu01.html">1</a> � <a class="downloadlink" href="bannermenu02.html">2</a> � <a class="downloadlink" href="bannermenu03.html">3</a> � <a class="downloadlink" href="bannermenu04.html">4</a></p>
</div>

</body>

The <div> at the bottom displays fine - its just those pesky gifs.

sockboy79

10:24 am on Apr 9, 2004 (gmt 0)

10+ Year Member

Thanks for that. I've checked - everything is where it should be. Like I said, the code is identical aprt from the image names and positions. One of my mates checked it on Safari and it worked mine, which has confused me further. Here is the code.

Exhibit A, which wont display

<body bgcolor="#ff0066">

<img
src="images/88x31pixelsubheading01.gif" alt="88 x 31 pixel banners"
style="z-index: 1; position: absolute; left: 5px; top: 0px" />
<img
src="images/tmbanner_88x31_01.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 30px" />
<img
src="images/tmbanner_88x31_02.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 80px" />
<img
src="images/tmbanner_88x31_04.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 30px; top: 129px" />
<img
src="images/tmbanner_88x31_03.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 30px" />
<img
src="images/tmbanner_88x31_05.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 80px" />
<img
src="images/tmbanner_88x31_06.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 174px; top: 129px" />
<img
src="images/tmbanner_88x31_07.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 30px" />
<img
src="images/tmbanner_88x31_08.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 80px" />
<img
src="images/tmbanner_88x31_09.gif" alt="Tartan Mafia 88 x 31 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 318px; top: 129px" />
<div style="position: absolute; left: 5px; top: 170px; background-color: #ff0066; width: 426px; height: 20px; text-align: right; ">
<p>page >> <a class="downloadlink" href="bannermenu01.html">1</a> � <a class="downloadlink" href="bannermenu02.html">2</a> � <a class="downloadlink" href="bannermenu03.html">3</a> � <a class="downloadlink" href="bannermenu04.html">4</a></p>
</div>

</body>

Exhibit B, which does

<body bgcolor="#ff0066">

<img
src="images/120x60pixelsubheading01.gif" alt="120 x 60 pixel banners"
style="z-index: 1; position: absolute; left: 5px; top: 0px" />
<img
src="images/tmbanner_120x60_01.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 14px; top: 30px" />
<img
src="images/tmbanner_120x60_02.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 14px; top: 100px" />
<img
src="images/tmbanner_120x60_03.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 158px; top: 30px" />
<img
src="images/tmbanner_120x60_04.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 158px; top: 100px" />
<img
src="images/tmbanner_120x60_05.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 302px; top: 30px" />
<img
src="images/tmbanner_120x60_06.gif" alt="Tartan Mafia 120 x 60 pixel banners - right click to download"
style="z-index: 1; position: absolute; left: 302px; top: 100px" />
<div style="position: absolute; left: 5px; top: 170px; background-color: #ff0066; width: 426px; height: 20px; text-align: right; ">
<p>page >> <a class="downloadlink" href="bannermenu01.html">1</a> � <a class="downloadlink" href="bannermenu02.html">2</a> � <a class="downloadlink" href="bannermenu03.html">3</a> � <a class="downloadlink" href="bannermenu04.html">4</a></p>
</div>

</body>

The <div> at the bottom displays fine - its just those pesky gifs.

john_k

2:15 pm on Apr 9, 2004 (gmt 0)

WebmasterWorld Senior Member

10+ Year Member

Popup blockers will affect IFrames. Do you have one running?

Also, if you directly request the document pointed to by the IFrame SRC attribute, what happens?

sockboy79

11:56 am on Apr 12, 2004 (gmt 0)

10+ Year Member

I have a pop-up blocker, but what is confusing me is that if it was affecting the IFrame, wouldn't it stop all of the pages running rather than just the first one? I have used a similar technique elsewhere on the site with no problems whatsoever, it is just this page that is doing it.

When I specifically called the page in the browser rather than the IFrame, the same thing happened - no images on page 1, everything else is fine.