I've got something that currently works in Firefox, but is a no-go in Safari and IE.
Here's the 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" >
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Welcome to Talk Me Through It</title>
<meta name="google-site-verification" content="TPcd0dkehj6PhYpfPw-fQhDub4uvGJxSE3YGn2ibmo0" />
<meta name="distribution" content="Global" />
<meta name="resource-type" content="document" />
<meta name="rating" content="General" />
<meta name="author" content="TMTI - Talk Me Through It" />
<meta name="copyright" content="TMTI - Talk Me Through It" />
<meta http-equiv="content-language" content="en" />
<link href="ovistyle.css" rel="stylesheet" type="text/css" />
<script language="JavaScript" type="text/JavaScript">
function showO(q){
document.getElementById('swifferobject').setAttribute('value','0'+q+'.swf')
}
</script>
<script language="JavaScript" type="text/JavaScript">
function showE(q){
document.getElementById('swifferembed').setAttribute('src','0'+q+'.swf')
}
</script>
</head>
<body>
<div id="container">
<div id="topContainer">
</div>
<div id="stepBox">
<div class="hoverdiv" onmouseover="showO(0); showE(0)">
step 1<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up
</div>
<div class="hoverdiv" onmouseover="showO(1); showE(1)">
step 2<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up
</div>
<div class="hoverdiv" onmouseover="showO(2); showE(2)">
step 3<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up<br>
Here's a bunch of useless text that makes the scrollbar show up
</div>
</div>
<div id="imageBox">
<div style="position:relative; left:3px; top:3px">
<object width="390" height="390">
<param id="swifferobject" name="movie" value="00.swf"/>
<embed id="swifferembed" src="00.swf" width="390" height="390"/>
This would probably be easier using swfobject. You can then just change the source on the swfobject you create dynamically. That library is constructed to work in multiple browsers so you don't have to worry about cross-browser compatibility.
Reply With Quote
Bookmarks