iframe z-index workaround or other solution.

I have a dymanic site that uses i-frames to call up specific content from different databases. This is only an issue on the home page as it contains information from several databases in a summary type fashon. BTW site uses FileMaker Pro on a Mac. I know ouch!

Here is my question:
I am redesigning our navigation to use .js dropdown and the menu is always behind the iframe no matter what z-index I assign to it. Is there a way to call out dynamic content in an iframe or something similar and be able to assign z-index to it?

Example of iframe content link:
http://www.somesite.com/FMPro?-DB=archives&-lop=and&-op=eq&Ad%20Type=reprint&-token=%5BFMP-currenttoken%5D&-sortfield=magazine%20number&-sortorder=descending&-format=ourPublication/recentArticlesHome.htm&-max=5&-intro=yes&-find

Any assistance would be greatly appreciated.

Very best regards

multilingualAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

seanpowellCommented:
The ifrmae does support the z-index property from MSIE 5.5 and on, but this won't work in the Mac browsers Safari 1.0, IE 5.2.2 and Opera 6.0. Are you using one of those?
0
multilingualAuthor Commented:
Our computers in house run Mac OS 9.2 and IE 5.1.  The z-index does not work in IE 5.1 browser either. I does work properly in Netscape 7.? (Mac) though. We refer to the site often and I need it to work properly in IE.

I thought of using the following script to load the dynamic page in a certain layer and then assigning the layer the proper z-index, but I have not had any success getting this following theory to work. BTW below example found in archive. Author is : COBOLdinosaur

<script language='JavaScript'>
<!--
function include(lyr,url)
{
   IE=(document.all) ? true : false;
   if (IE)
   {
      // IE version
      var xml = new ActiveXObject("Microsoft.XMLHTTP");
      xml.Open( "GET", url, false );
      xml.Send()
      document.getElementById(lyr).innerHTML=xml.responseText;
   }
   else
   {
      // Mozilla/Netscrap 6+ version
            var xml=new XMLHttpRequest();
            xml.open("GET",url,false);
            xml.send(null);
            document.getElementById(lyr).innerHTML=xml.responseText;
   }
}
//-->
</script>

You can trigger the script off the load:
<body onLoad="include('somediv','http://somepath/somefile.html'">
where somediv looks like: <div id="somediv">&nbsp;</div>

or inline as a conventional include:
<script language='JavaScript'>
   document.write('<div id="somediv">&nbsp;</div>');
   include('somediv','http://somepath/somefile.html');
</script>

Any thoughts?

0
seanpowellCommented:
>>The z-index does not work in IE 5.1 browser either.
That's correct - it's only 5.5+ as noted. I believe the code you pasted above needs to be online to function - were you tesing it locally?
0
Ultimate Tool Kit for Technology Solution Provider

Broken down into practical pointers and step-by-step instructions, the IT Service Excellence Tool Kit delivers expert advice for technology solution providers. Get your free copy now.

multilingualAuthor Commented:
Yes, I was testing off-line, I will try on-line and post my results.

Regards
0
multilingualAuthor Commented:
Tested the code online several different ways and still could not make it work properly. Perhaps I am not familiar enough with the implementing the above .js. I will scale down my page to the bare minimum and see if I can get the script to work.

Regarding browser:
Last I checked, MS did not do an update to IE for Mac OS 9.2 past 5.1. They did an update for OSX, but left the OS 9 people in the lurch. I have not checked in a little while, perhaps there has been one, I will check.

Any additional ideas as to other ways I can get a remote url to present in a layer?

As I mentioned above, I will scale back my page and try the .js code I referenced.

Regards
0
multilingualAuthor Commented:
No go with the following code in NS7 or IE5.1.

<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language='JavaScript'>
<!--
function include(lyr,url)
{
   IE=(document.all) ? true : false;
   if (IE)
   {
      // IE version
      var xml = new ActiveXObject("Microsoft.XMLHTTP");
      xml.Open( "GET", url, false );
      xml.Send()
      document.getElementById(lyr).innerHTML=xml.responseText;
   }
   else
   {
      // Mozilla/Netscrap 6+ version
            var xml=new XMLHttpRequest();
            xml.open("GET",url,false);
            xml.send(null);
            document.getElementById(lyr).innerHTML=xml.responseText;
   }
}
//-->
</script>
</head>

<body onLoad="include('layer1','http://www.somesite.com'" bgcolor="#FFFFFF">
<div id="layer1" style="position:absolute; left:0px; top:0px; width:500px; height:200; z-index:1; visibility: visible; background-color: #CCCCCC; layer-background-color: #CCCCCC; border: 1px none #000000"></div>
</body>
</html>

I substitute "somesite" with an actual page, what am I missing?

Thanks for any assistance.

BTW, Mac OS9 latest IE version is 5.1.7, so browser upgrade is not an option at the moment.
0
ZontarCommented:
Did somebody let a page-widening troll from Slashdot loose in here? Geeeez...
0
multilingualAuthor Commented:
Not sure what you mean, this thread looks fine in my browser.
0
ZontarCommented:
I'm at 10X7 resolution and there's a horizontal scrollbar half again as big as the page, due to the extremely long link posted in the question. And I don't keep my font settings particularly large, either.
0
seanpowellCommented:
That's probably a browser interpretation of the cell. At 1280 I have no scroll, but the link wraps. It may not be wrapping for you...
0
multilingualAuthor Commented:
Question still not answered, does anyone have a suggestion??
0
seanpowellCommented:
Sorry...

It should be fine as long as you're using a fully qualified URL (http://www.domain.com/index.html) If it's not working - it may be another Mac/Browser issue. I can't test on a Mac, and haven't been able to find a reference as to why it wouldn't function :-)
0
multilingualAuthor Commented:
Thanks for the reply, but I have tried both methods (onload & inline as a conventional include) and cannot get either to work on Mac (NS7) or PC (IE6). Perhaps there is an error in the code?

Surely this is not that hard to do? Have you ever had sucess with the code I referenced above? If so, can you post some working code? Thanks for any assistance.

Regards
0
seanpowellCommented:
Here's a page on my site that uses this method (view the source). I'm now going to check if my code is different from your code...

http://www.pdgmedia.com/new_page_2.htm
0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
seanpowellCommented:
This is with your code - doesn't work - so hold on a sec...
http://www.pdgmedia.com/new_page_3.htm
0
seanpowellCommented:
Damn - change your onload line to this:

<body onLoad="include('layer1','http://www.pdgmedia.com/index.html')">
0
seanpowellCommented:
You were missing a  )
0
multilingualAuthor Commented:
Thanks for all your help, I was able to copy your code and get it to work in NS7 (Mac) and on the PC (IE6).

FWIW, the div link must also be located on the same site as the loaded .htm file. I was calling a file from another one of our sites and I could not get it to work, but once I called a file from the site where the .htm was called, all worked fine.

Thanks again George, I am going to post your working code below in case someone else runs arcoss this thread and needs it.

Working code:

<html>
<head>
<title>test</title>
<link rel="stylesheet" type="text/css" media="screen" href="styles.css">
<script language='JavaScript'>
<!--
function include(lyr,url)
{
     IE=(document.all) ? true : false;
     if (IE)
     {
          // IE version
          var xml = new ActiveXObject("Microsoft.XMLHTTP");
          // older versions (IE4 and some IE5.0) might be using MSXML2.XMLHTTP.4.0
          xml.Open( "GET", url, false );
          xml.Send()
          document.getElementById(lyr).innerHTML=xml.responseText;
     }
     else
     {
          // Mozilla/Netscrap 6+ version
          var xml=new XMLHttpRequest();
          xml.open("GET",url,false);
          xml.send(null);
          document.getElementById(lyr).innerHTML=xml.responseText;
     }
}
//-->
</script>

</head>

<body onLoad="include('layer','http://www.somesite.com/index.htm')">

<div id="layer">&nbsp;</div>

</body>
</html>
0
seanpowellCommented:
>>I was calling a file from another one of our sites

Now you tell me :-) When you said specific content from different databases, I assumed you meant the same site. Sorry about that - I should have asked you earlier on...
0
multilingualAuthor Commented:
Thanks again for all your assistance. Now I just need to get the proven theory to work as I hope it can. Well... tomorrow is another day.

Regards
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
HTML

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.