Scrollable Content II [Archive] - Dynamic Drive Forums

Sephira

01-08-2006, 04:44 AM

i am using the script Scrollable Content II, and it works fine in Firefox, but sits and does nothing in IE. when i view the script on it's original page here (http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm) in IE it works fine, but not on my page.

it's not active, so i can't direct link it, but here is my source 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" xml:lang="en" lang="en">

<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<title>test</title>
<style type="text/css" media="screen">
@import "styled.css";
</style>
</head>

<body>

<div id="Content">
<div id="top"> </div>
<div id="left"> </div>
<div id="right">

<script type="text/javascript">

/******************************************
* Scrollable content script II- © Dynamic Drive (www.dynamicdrive.com)
* Visit http://www.dynamicdrive.com/ for full source code
* This notice must stay intact for use
******************************************/

iens6=document.all||document.getElementById
ns4=document.layers

//specify speed of scroll (greater=faster)
var speed=5

if (iens6){
document.write('<div id="container"

style="position:relative;width:365px;height:200px;border:1px solid

#transparent;overflow:hidden">')
document.write('<div id="content"

style="position:absolute;width:360px;left:0;top:0">')
}
</script>

<ilayer name="nscontainer" width=360 height=200 clip="0,0,175,200">
<layer name="nscontent" width=360 height=200 visibility=hidden>

text would go here. edited for length.

</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6)
document.write('</div></div>')
</script>

<table width="365px"><td><p align="right">
<a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img

src="up.gif" border=0 align="top"></a> <a href="#" onMouseover="movedown()"

onMouseout="clearTimeout(movedownvar)"><img src="down.gif" border=0

align="top"></a></p></td>
</table>

<script language="JavaScript1.2">
if (iens6){
var crossobj=document.getElementById? document.getElementById("content") :

document.all.content
var contentheight=crossobj.offsetHeight
}
else if (ns4){
var crossobj=document.nscontainer.document.nscontent
var contentheight=crossobj.clip.height
}

function movedown(){
if (iens6&&parseInt(crossobj.style.top)>=(contentheight*(-1)+100))
crossobj.style.top=parseInt(crossobj.style.top)-speed+"px"
else if (ns4&&crossobj.top>=(contentheight*(-1)+100))
crossobj.top-=speed
movedownvar=setTimeout("movedown()",20)
}

function moveup(){
if (iens6&&parseInt(crossobj.style.top)<=0)
crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
else if (ns4&&crossobj.top<=0)
crossobj.top+=speed
moveupvar=setTimeout("moveup()",20)

}

function getcontent_height(){
if (iens6)
contentheight=crossobj.offsetHeight
else if (ns4)
document.nscontainer.document.nscontent.visibility="show"
}
window.onload=getcontent_height
</script>

</div>
<div id="bottom"> </div>

</div>

</body>
</html>

jscheuer1

01-08-2006, 05:47 AM

IE seems unable to distinguish between the script created division with an id of "content" and your hard coded division with the id of "Content". This is not exactly right but, wouldn't be the first time a browser got confused when it shouldn't. Generally, upper and lower case letters are considered unique in situations like these but, obviously not this time. Change your division to id="Contents" or some other unique name not used by the script, and IE will be fine. Alternatively, the script could be edited to use another id but, that would be a little tricky, as the word content is used for many things in it, not just as the id for one of its generated divisions.