Iframe loading into parent

I don’t know if you can help but I am having difficulty in opening a link in an Iframe.

If I explain, I have four pages

Page 1 containing the Iframe

Page 2 containing a series of thumbnails that opens in Iframe on page 1

Page 3 is the larger image that opens in the Iframe on page 1 after clicking the thumbnail on page 2

Page 4 is a page with a linking menu that has a link to page 3

The task I am struggling with is to get the link on page 4 to open the larger image of page 3 in the Iframe on page 1.

Now I maybe doing something wrong but the code is opening page 2 in the Iframe on page 1

Below are the links to the pages in question

Page 1 Art for Sale - Bertram Enterprises

Page 2 Bertram Enterprises Collection_Ver2

Page 3 http://www.bertramenterprises.co.uk/artists/Collection_ver2/pages/Dutton ‘Reflections’.html

Page 4 Jenni Dutton - Bertram Enterprises link near bottom of page - Art for Sale

I hope you are able to help as I wish to use this on many more of the images.

Sorry but I don´t quite understand what you need, what is exactly what the link Art for Sale is supposed to do?

As I understand you have 4 pages, 1 has the iframe and 3 through 4 should open inside the iframe right?

1 through 3 are correct.

Page 4 has a link Art for Sale that does not work? I see it working on the site, or is it supposed to do something else?

By the way, if I may recommend you something about the arrows used to move around the images, I think they should all be at the same height and not move along with the height or width of the image, I think it is annoying, at least for me, if you are in a slide show you are focused in the image and not where the arrow went.

tlacaelelrl - Thanks for the reply and comments.

The problem is that when I click on the Art for Sale link on page 4 it is supposed to open a large image from the specific artists in the iframe what is happening is that it opens the full page of thumbnails in the iframe.

I agree with the arrows and it is something I am looking into.

When you click on that link it tries to open

Art for Sale - Bertram Enterprises

and I am able to see the image coming up then opens the thumbnails it seems like there is some sort of redirect mechanism inside that previously mentioned link that is firing on window load.

Also in the first page where you say you have the iframe, there is an iframe but on the left sidebar.

<div id="sidebar1">
<iframe width="100%" scrolling="auto" height="310 px" frameborder="0" src="http://www.bertramenterprises.co.uk/artists/Collection_ver2/pages/Dutton 'Reflections'.html">

So you should first think on placing the iframe somewhere else or the page will not look very good.

I really appreciate your help - sometimes a problem just drives you mad.

I have checked the four pages in question through all their code, sidebar1 does not exist on those four pages as far as I can see but purely on the home page.

I have looked through for any conflicting redirects and cannot find any, so am really frustrated.

Can you post the full source of these 2 pages

Art for Sale - Bertram Enterprises

Bertram Enterprises

Thanks for your help, below are the two pages of code as requested.

For Sale code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<!-- InstanceBegin template="/Templates/bertram_002_ver2.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title>Art for Sale - Bertram Enterprises</title>
<meta name="keywords" content="Art for sale, bertram enterprises, affordable art, paintings, visual arts," />
<meta name="description" content="Art for Sale from manu great contemporary artists" />
<script type="text/javascript">
var text = window.location.href;
function delineate(str) {
theleft = str.indexOf("=") + 1;
theright = str.indexOf("&");
return(str.substring(theleft, str.length));
}
url=delineate(text)

function refreshFrame() {
if(sale.location!=url&&url!=location.href)
sale.location.replace(url);
}</script>
<!-- InstanceEndEditable --><!-- InstanceBeginEditable name="head" --><!-- InstanceEndEditable -->
<link href="css/thrColAbsHdr.css" rel="stylesheet" type="text/css" />
<link rel="shortcut icon" href="http://www.simplyalien.com/images/favicon.ico" />
<script src="http://cdn.jquerytools.org/1.2.5/full/jquery.tools.min.js"></script>
<link rel="stylesheet" type="text/css" href="css/accordian.css"/>
<script type="text/javascript">
var gaJsHost = (("https:" == document.location.protocol) ? "https://ssl." : "http://www.");
document.write(unescape("%3Cscript src='" + gaJsHost + "google-analytics.com/ga.js' type='text/javascript'%3E%3C/script%3E"));
</script>
<script type="text/javascript">
try {
var pageTracker = _gat._getTracker("UA-2636435-13");
pageTracker._trackPageview();
} catch(err) {}</script>
<!--[if IE 5]>
<style type="text/css"> 
/* place css box model fixes for IE 5* in this conditional comment */
.thrColAbsHdr #sidebar1 { width: 180px; }
.thrColAbsHdr #sidebar2 { width: 190px; }
</style>
<![endif]-->
<script type="text/javascript">
<!--
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
}
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
}
//-->
</script>
<link href="styles/form_fancy_002.css" rel="stylesheet" type="text/css" />
<link href="styles/form_fancy.css" rel="stylesheet" type="text/css" />
<script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
</head>
<body class="thrColAbsHdr" onload="MM_preloadImages('images/4phases_btn.png')">
<!-- Arvind Satyanarayan script added by John Smith on Oct XX, 20XX. -->
<script type="text/javascript">
<!--
function toggle_visibility(id) {
var e = document.getElementById(id);
if(e.style.display == 'block')
e.style.display = 'none';
else
e.style.display = 'block';
}
//-->
</script>
<div id="container">
  <div id="header">
    <h1 id="logo"><img src="http://www.sitepoint.com/forums/images/logo_bertram.png" alt="Bertram Enterprises Logo" width="492" height="68" /></h1>
    <br id="clear"/>
    <div id="navigation">
      <ul>
        <li><a href="index.php">home</a></li>
        <li><a href="Eduardo_Paolozzi.html">focus on</a></li>
        <li><a href="for_sale.html">works for sale</a></li>
        <li><a href="featured_artists.html">featured artists</a></li>
        <li><a href="about_us.html">about us</a></li>
        <li><a href="publications.html">publications</a></li>
        <li><a href="news.html">news</a></li>
        <li><a href="contact.html">contact</a></li>
      </ul>
    </div>
    <!-- end #header -->
  </div>
  <div id="sidebar2a"></div>
  <div id="newsletter">
    <form class="fancy_002" method="post" action="http://www.bertramenterprises.co.uk/contactfm/register_bertramenterprises_contact.php" name="Bertram Enterprises Newsletter Request">
      <input type="hidden" name="env_report" value="REMOTE_ADDR">
      <input type="hidden" name="recipients" value="geoffreyMATAH6TKbertramenterprises.co.uk" />
      <input type="hidden" name="required" value="email:Your email address" />
      <input type="hidden" name="subject" value="Bertram Enterprises Newsletter Request" />
      <input type="hidden" name="good_url"    value="http://www.bertramenterprises.co.uk/contactfm/register_bertramenterprises_response.html" />
      <ol>
        <li>
          <fieldset>
          <ol>
            <li>
              <label for="email"></label>
              <input name="email" type="text" id="email" onFocus="this.value=''" value="enter your email" size="31" />
            </li>
          </ol>
          </fieldset>
        </li>
      </ol>
      <p style="TEXT-ALIGN: right">Sign up for the newsletter&nbsp;&nbsp; &nbsp;
        <input value="OK" type="submit" />
      </p>
    </form>
    <!--<div id="newsletter_email">Newsletter</div>-->
  </div>
  <div id="social">
    <!-- AddThis Button BEGIN -->
    <div class="addthis_toolbox addthis_default_style"> <a class="addthis_button_linkedin"></a> <a class="addthis_button_facebook"></a> </div>
    <script type="text/javascript">var addthis_config = {"data_track_clickback":true};</script>
    <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#username=barryaaa"></script>
    <!-- AddThis Button END -->
  </div>
  <div id="sidebar2">
    <h3>Featured Artists</h3>
    <div id="accordion">
      <h2 class="current">> Jenni Dutton</h2>
      <div class="pane" style="display:block">
        <p>Jenni  works in Somerset.  Trained as a painter at St Martins and Byam Shaw in London, Jenni*  moved on to make large wire and paper wrapped figures that developed  into &#8216;dresses&#8217;. <a class="maillink" href="Jenni_Dutton.html">> More</a></p>
      </div>
      <h2>> Pennie Elfick</h2>
      <div class="pane">
        <p>Contrary to immediate first impressions Pennie&#8217;s paintings are firmly based in landscape. Specifically, she attempts to capture the transient nature of light. <a class="maillink" href="Pennie_Elfick.html">> More</a></p>
      </div>
      <h2>> Andrew George</h2>
      <div class="pane">
        <p>It is not so common to find an artist who is so adept with the technique of egg tempera. It is a hard medium to control but Andrew George is particularly masterful with it.<a class="maillink" href="Andrew_George.html">> More</a></p>
      </div>
      <h2>> John Hilliard</h2>
      <div class="pane">
        <p>John Hilliard&#8216;s art investigates the nature of light. Inspired by walks along beaches, his images are not in any way topographical but explorations of the interplay between light, reflected light, sea and sky. <a class="maillink" href="John_Hilliard.html">> More</a></p>
      </div>
      <h2>> Paul Jones</h2>
      <div class="pane">
        <p>Paul was a scholarship student at Bath Academy of Art, Corsham at a time when Adrian Heath, Robyn Denny and Howard Hodgkin were his tutors. <a class="maillink" href="Paul_Jones.html">> More</a></p>
      </div>
      <h2>> Ione Parkin</h2>
      <div class="pane">
        <p>Ione has spent the past twenty years as a professional artist painting images that reflect elements of the world that she has experienced. <a class="maillink" href="Ione_Parkin.html">> More</a></p>
      </div>
      <h2>> Amanda Wallwork</h2>
      <div class="pane">
        <p>Wallwork paints history. Her images reflect the marks and traces left behind by people on places and objects, both deliberate and accidental. <a class="maillink" href="Amanda_Wallwork.html">> More</a></p>
      </div>
    </div>
    <!--<script type="text/javascript">



$(document).ready(function(){

	//Hide (Collapse) the toggle containers on load
	$("#accordion div.pane"); 

	//Switch the "Open" and "Close" state per click
	$("h2").toggle(function(){
		$(this).addClass("current");
		}, function () {
		$(this).removeClass("current");
	});

	//Slide up and down on click
	$("h2").click(function(){
		$(this).next("#accordion div.pane").slideToggle("slow");
	});

});


</script>-->
    <!-- activate tabs with JavaScript -->
    <script>
$(function() { 

$("#accordion").tabs("#accordion div.pane", {tabs: 'h2', effect: 'slide', initialIndex: 7});
//First UNBIND the existing click handler
$('#accordion h2').unbind('click');

// add new click handler
$('#accordion h2').click(function (){
     // First make other panes hidden
     $(this).siblings('h2').removeClass();
     $(this).siblings('div').slideUp();
     // Test if clicked on current
     if(!$(this).hasClass("current")){
         //If not, then make me current
         //preserving Toggle feature
         $(this).addClass("current");
         $(this).next().slideDown()
       } else {
         //If so, then close me too
         $(this).removeClass();
         $(this).next().slideUp()
       }
  }
 );
});
</script>
    <!--Sector Experience
    <ul>
      <li>Arts</li>
      <li>Education</li>
      <li>IT</li>
      <li>Local Government</li>
      <li>Market Research</li>
      <li>Not for Profit</li>
      <li>Telecomms</li>
    </ul>-->
    <!-- end #sidebar2 -->
  </div>
  <!-- InstanceBeginEditable name="main content" -->
  <div id="mainContent_002">
    <h1>Bertram Enterprises Works for Sale</h1>
    <iframe src="../artists/Collection_ver2/index.html" width="670" height="1500" scrolling="no" frameborder="0" name="sale"></iframe>
    <div></div>
  </div>
  <!-- InstanceEndEditable -->
  <div id="footer">
    <div id="footer_nav">
      <ul>
        <li>
          <script type="text/javascript">
AC_FL_RunContent( 'codebase','http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0','width','10','height','10','src','http://www.simplyalien.com/swf/simply_alien','quality','high','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','http://www.simplyalien.com/swf/simply_alien' ); //end AC code
</script>
          <noscript>
          <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="10" height="10">
            <param name="movie" value="http://www.simplyalien.com/swf/simply_alien.swf" />
            <param name="quality" value="high" />
            <embed src="http://www.simplyalien.com/swf/simply_alien.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="10" height="10"></embed>
          </object>
          </noscript>
        </li>
        <li><a href="privacy.html">privacy</a></li>
        <li><a href="miniblog/adm/admin.php">admin</a></li>
        <li><a href="links.html">links</a></li>
        <li><a href="contact.html">contact</a></li>
      </ul>
    </div>
    <!-- end #footer -->
  </div>
  <!-- end #container -->
</div>
</body>
<!-- InstanceEnd -->
</html>

Dutton Reflections Code

<html>
<head>
<TITLE>Bertram Enterprises</TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<link href="../images/galleryStyle.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
if (window == top) {
var url='window.location.replace("http://www.bertramenterprises.co.uk/for_sale.html?var1='+window.location.href+'")';
eval(url);
}
</script>
<script>

function ifExistsWrite(str){
	var re = new RegExp ('\\"', 'gi') ;
	var newstr = str.replace(re, '&quot;');
	if (newstr != "")
		document.write(newstr+"<br>");
}

</script>
</head>
<body bgcolor="#FFFFFF" marginheight=0 marginwidth=0 leftmargin=0 topmargin=0>
<table width=100% height=100%>
  <tr>
    <td align=middle valign=top><table>
        <tr>
          <td colspan=3 align=middle><a href="http://www.sitepoint.com/forums/index.html"><img border=0 vspace=12 src="http://www.sitepoint.com/forums/images/arrow_up.gif" /></a> </td>
        </tr>
        <tr>
          <td width=17 valign=middle><a href="Dunseath_Reversal.html"><IMG hspace=15 SRC="http://www.sitepoint.com/forums/images/arrow_prev.gif" BORDER=0 /></a></td>
          <td align=middle valign=top width="492"><table cellpadding=0 cellspacing=0 border=0 width="492">
              <tr>
                <td valign=top><img src="http://www.sitepoint.com/forums/images/Dutton%20%27Reflections%27.jpg" width="492" height="492" alt="Dutton 'Reflections'" style="border:0pt solid white" /><br />
                </td>
                <td valign=top background="../images/wh_rt.gif"><img src="http://www.sitepoint.com/forums/images/wh_top_rt.gif" /> </td>
              </tr>
              <tr>
                <td background="../images/wh_bot.gif"><img src="http://www.sitepoint.com/forums/images/wh_bot_lt.gif" /><br />
                </td>
                <td valign=top><img src="http://www.sitepoint.com/forums/images/wh_bot_corner.gif" /><br />
                </td>
              </tr>
            </table></td>
          <td align=right width=17 valign=middle><a href="Dutton_The_Kiss.html"><img hspace=5 border=0 src="http://www.sitepoint.com/forums/images/arrow_next.gif" /></a></td>
        </tr>
      </table>
      <table>
        <tr>
          <td align=middle valign=top width="492"><table cellpadding=0 cellspacing=0 border=0 width="492">
              <tr>
                <td align=middle><div id="imageInfo">
                    <div class="content">
                      <script>
ifExistsWrite("");
ifExistsWrite("");
ifExistsWrite("Jenni Dutton (b.1951) - Reflection, 2008<br>mixed media - 70 x 40 x 13 cm<br>Price: &pound;2,300<br><br>Jenni Dutton's sculptures explore body adornment, first seen with her concept dress sculptures (2000-2004). Extending the notion of body wrapping is this series of witty torsos collaged with shattered china and ephemera, that have proven to be as highly popular as they are unusual.");
ifExistsWrite("");
ifExistsWrite("");
</script>
                    </div>
                  </div></td>
              </tr>
            </table></td>
        </tr>
      </table></td>
  </tr>
</table>
</body>
</html>

This is the script that redirects you


if (window == top) {
var url='window.location.replace("http://www.bertramenterprises.co.uk/for_sale.html?var1='+window.location.href+'")';
eval(url);
}

Check what it says about window.location.replace

window location info

Then at Art for Sale - Bertram Enterprises you you process the URL with this url=delineate(text) and then you have a function that supposedly refreshes the frame


function refreshFrame() {
if(sale.location!=url&&url!=location.href)
sale.location.replace(url);
}

But you never make use of it, also what is sale because is not declared anywhere?

And what is the ID of the frame where you want to place the page?