Iframe / Javascript not working in Firefox [Archive]

gkornbluth

02-13-2008, 04:18 PM

It’s probably something really simple, but I’m really lost and could use some help.

I’ve set up a web page, using iframes and a short Javascript. The page displays a series of thumbnails on the left. When the thumbnails are rolled over, the page shows an associated web page on the right.

Page link http://www.jkwebdesigns.com/disney/Disney-frames.html

The page works fine in IE (7) but the associated web page does not display in Firefox (2).

The code I used is shown below.

Thanks,

Jerry Kornbluth
________________________
The show.js

document.onmouseover = showPage;

function showPage(e)
{
var navButton, theShiftKey;

if (e)
{
navButton = e.target;
theShiftKey = e.shiftKey;
}
else if (event)
{
navButton = event.srcElement;
theShiftKey = event.shiftKey;
}

var thePage = navButton.parentNode.href;

if (thePage && !theShiftKey)
{
parent.frames['fullPage'].location = thePage;
}
}

______________________________

The disney.css

body {padding-top: 10px; width: 800px; background-color:#000000; color: #FFFFFF; }
body {font-family: "Trebuchet MS"}

img {border-style: none;}

#title {margin-top: 0px; font-weight: bold; font-size: x-large; }

#description {margin-top: -11px; font-size: large; }

_______________________

The Disney-frames page

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Disney Test</title>
<script type="text/javascript" src="scripts/nav-left.js"></script>
<link rel="stylesheet" href="css/disney.css" type="text/css" />
</head>

<body >
<table width="1200" border="0" cellpadding="20" >

<td valign="top">><div align="left">
<iframe src="left-disney.html" align="left" width="160" height="600" frameborder="0" />
</div></td>
<td ><div align="left">
<iframe src="disney-castle.html" width="850" height="900" align="left" frameborder="0" name="fullPage" />
</div> </td>
</tr>
</table>
</body>
</html>

BLiZZaRD

02-13-2008, 04:25 PM

First, you are using tables for layout and design, you shouldn't do that, not when you are using divs and CSS as well. Get rid of the tables. You didn't use them right either, you need a table row <tr> open before you can have table data <td>'s open. (No row, nothing to store the row data)

you can go here for a list of other issues (http://validator.w3.org/check?uri=http%3A%2F%2Fwww.jkwebdesigns.com%2Fdisney%2FDisney-frames.html&charset=%28detect+automatically%29&doctype=Inline&group=0) that is wrong with the mark up. Fixing all of these should alleviate your problems.