Dreamweaver8 Scrollable text for Dummies

**dench82** · 05-02-2007, 08:37 PM

PLEASE HELP... I AM VERY NEW TO WEB DESIGN AND HAVE TO BUILD A SITE FOR A UNI PROJECT MY SITE IS BUILT BUT ID REALLY LIKE TO PUT A SCROLLABLE TEXT BOX ONTO THE PAGE AS SPACE IS LIMITED

I HAVE TRIED VARIOUS CODES ON VARIOUS FORUMS BUT TO NO AVAIL

PLEASE COULD SOMEONE PLEASE POST A CODE AND AN IDIOTS GUIDE TO INSERT IT FOR ME PLEASE!!!

IM DESPERATE!!!

http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm

I HAVE GOT THIS SCROLL IN MY PAGE BUT THE SCROLL DOESNT ACTUALLY WORK SO IF SOMEONE COULD JUST HELP ME RECTIFY THAT, THAT WOULD BE BRILLIANT

IM USING DREAMWEAVER 8 IM ON IE6

MANY THANKS IN ADVANCE

**djr33** · 05-02-2007, 10:20 PM

NO NEED TO WRITE IN ALL CAPS... IT MAKES IT HARDER TO READ!

Dreamweaver has nothing to do with it, beyond that you must use the code view to insert the code.

The demo on the page works fine, so it is something you did when adding it to the page.

As such, we will need to see a link to YOUR page, or at the very least have you paste the source code, so we can see what is wrong.

I can't really think of any easier way to explain it, since you simply need to paste the code into your page, then change the content of the div. Then, as it says, save/upload the two arrows to your site, in the same directory. That's about it.

**dench82** · 05-03-2007, 06:07 PM

Originally Posted by djr33

NO NEED TO WRITE IN ALL CAPS... IT MAKES IT HARDER TO READ!

Dreamweaver has nothing to do with it, beyond that you must use the code view to insert the code.

The demo on the page works fine, so it is something you did when adding it to the page.

As such, we will need to see a link to YOUR page, or at the very least have you paste the source code, so we can see what is wrong.

I can't really think of any easier way to explain it, since you simply need to paste the code into your page, then change the content of the div. Then, as it says, save/upload the two arrows to your site, in the same directory. That's about it.

i really dont understand what i'v done wrong as i followed the steps exactly. the only thing i can think of is something is wrong with the way the arrow image files are linked??

im not hosted at the moment so here is the code. it would be great if someone could look it over and fix it for me

many thanks

ps, the page is set as 3. a static header. a static nav bar (on left) and scrollable text box (on right) the page shouldnt scroll only the info in text box

!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=iso-8859-1" />


<title>Share The Love - What Is Chlamydia ?</title>


<link href="style/global.css" rel="stylesheet" type="text/css" media="screen"/>





<link rel="Shortcut Icon" href="images/favicon.ico" type="image/x-icon" />


<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="pragma" content="no-cache" />
<meta name="distribution" content="GLOBAL" />
<meta name="revisit-after" content="7 Days" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="robots" content="all" />
<meta name="mssmarttagspreventparsing" content="true" />
<meta name="title" content="title" />
<meta name="subject" content=" " />
<meta name="description" content=" " />
<meta name="keywords" content=" " />
<meta name="author" content=" " />
<meta name="rating" content="safe for kids" />
<meta name="Language" content="en-GB" />
<script type="text/JavaScript">

</script>
<body onload="MM_preloadImages('images/b_home1.gif','images/b_what1.gif','images/b_symp1.gif','images/b_safe1.gif','images/b_where1.gif','images/b_jonny1.gif','images/b_links1.gif')">


<div id="bodybg">


<div id="container">


<div id="header">
<img src="images/i_logo.gif" alt="Share The Love" />


</div>


<div id="content">

<div id="left"><img src="images/i_nav_top.gif" alt="Share The Love" width="188" height="18" style="margin:0; padding:0;" /><div class="whiteBG">
<a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','images/b_home1.gif',1)"><img src="images/b_home.gif" name="Image13" width="188" height="13" border="0" id="Image13" class="navBut" /></a><br />
<a href="whatis.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image14','','images/b_what1.gif',1)"><img src="images/b_what.gif" name="Image14" width="188" height="12" border="0" class="navBut" id="Image14" /></a><br />
<a href="symptoms.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image15','','images/b_symp1.gif',1)"><img src="images/b_symp.gif" name="Image15" width="188" height="12" border="0" class="navBut" id="Image15" /></a><br />
<a href="amisafe.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','images/b_safe1.gif',1)"><a href="where.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image17','','images/b_where1.gif',1)"><img src="images/b_where.gif" name="Image17" width="188" height="12" border="0" class="navBut" id="Image17" /></a><a href="amisafe.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','images/b_safe1.gif',1)"><img src="images/b_safe.gif" name="Image16" width="188" height="12" border="0" class="navBut" id="Image16" /></a><br />
<a href="johnny.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image18','','images/b_jonny1.gif',1)"><img src="images/b_jonny.gif" name="Image18" width="188" height="12" border="0" class="navBut" id="Image18" /></a><br />
<a href="links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image19','','images/b_links1.gif',1)"><img src="images/b_links.gif" name="Image19" width="188" height="12" border="0" class="navBut" id="Image19" /></a><br />
</div>
<img src="images/i_nav_bot.gif" alt="Share The Love" style="margin:0; padding:0;" />
</div>

<div id="right"><img src="images/main_what.gif" width="447" height="78" /><div class="whiteBG"><br />
<div align="center"><img src="images/pics/couple.JPG" width="266" height="186" /><br />
<div class="contentText"> <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:400px;height:90px;border:1px solid white;overflow:hidden">')
document.write('<div id="content" style="position:absolute;width:400px;left:0;top:0">')
}
</script>

</div>
<br />
<ilayer name="nscontainer" left="17" top="22" width=400 height=90 clip="0,0,400,160">
<layer name="nscontent" left="1" top="1" width=400 height=90 visibility=hidden>

<div align="left">

<br />
<br />
<br />
Chlamydia...<br />
</div>
</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6)
document.write('</div></div>')
</script>
<br />
<table width="400"><td width="400" height="7"><p align="right">
<a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img src="images/pics/up.gif" width="9" height="5" border="0" /></a> <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)"><img src="images/pics/down.gif" width="9" height="5" border="0" /></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>
<br />
</div>
</div>
<img src="images/i_content_bot.gif" alt="Share The Love" /></div>

<br class="clearBoth" />


</div>


</div>


</div>

</body>
</html>

**jscheuer1** · 05-03-2007, 06:18 PM

There may be other problems. You do have an onload conflict. Get rid of this:

Code:

window.onload=getcontent_height

Add it into your body onload event like so:

Code:

<body onload="getcontent_height();MM_preloadImages('images/b_home1.gif','images/b_what1.gif','images/b_symp1.gif','images/b_safe1.gif','images/b_where1.gif','images/b_jonny1.gif','images/b_links1.gif')">

**dench82** · 05-03-2007, 06:41 PM

Originally Posted by jscheuer1

There may be other problems. You do have an onload conflict. Get rid of this:

Code:

window.onload=getcontent_height

Add it into your body onload event like so:

Code:

<body onload="getcontent_height();MM_preloadImages('images/b_home1.gif','images/b_what1.gif','images/b_symp1.gif','images/b_safe1.gif','images/b_where1.gif','images/b_jonny1.gif','images/b_links1.gif')">

thanks john i have made the changes and it does look different but still when i preview it in IE6 it still doesnt scroll??
what should the tag settings say for the arrow images? i have a feeling the problem lies there??

this is the new code, would be greatful if you could look it over

thank u again

<!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=iso-8859-1" />


<title>Share The Love - What Is Chlamydia ?</title>


<link href="style/global.css" rel="stylesheet" type="text/css" media="screen"/>





<link rel="Shortcut Icon" href="images/favicon.ico" type="image/x-icon" />


<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
<meta http-equiv="pragma" content="no-cache" />
<meta name="distribution" content="GLOBAL" />
<meta name="revisit-after" content="7 Days" />
<meta http-equiv="imagetoolbar" content="no" />
<meta name="robots" content="all" />
<meta name="mssmarttagspreventparsing" content="true" />
<meta name="title" content="title" />
<meta name="subject" content=" " />
<meta name="description" content=" " />
<meta name="keywords" content=" " />
<meta name="author" content=" " />
<meta name="rating" content="safe for kids" />
<meta name="Language" content="en-GB" />
<script type="text/JavaScript">

</script>
<body onload="getcontent_height();MM_preloadImages('images/b_home1.gif','images/b_what1.gif','images/b_symp1.gif','images/b_safe1.gif','images/b_where1.gif','images/b_jonny1.gif','images/b_links1.gif')">


<div id="bodybg">


<div id="container">


<div id="header">
<img src="images/i_logo.gif" alt="Share The Love" />


</div>


<div id="content">

<div id="left"><img src="images/i_nav_top.gif" alt="Share The Love" width="188" height="18" style="margin:0; padding:0;" /><div class="whiteBG">
<a href="index.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image13','','images/b_home1.gif',1)"><img src="images/b_home.gif" name="Image13" width="188" height="13" border="0" id="Image13" class="navBut" /></a><br />
<a href="whatis.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image14','','images/b_what1.gif',1)"><img src="images/b_what.gif" name="Image14" width="188" height="12" border="0" class="navBut" id="Image14" /></a><br />
<a href="symptoms.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image15','','images/b_symp1.gif',1)"><img src="images/b_symp.gif" name="Image15" width="188" height="12" border="0" class="navBut" id="Image15" /></a><br />
<a href="amisafe.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','images/b_safe1.gif',1)"><a href="where.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image17','','images/b_where1.gif',1)"><img src="images/b_where.gif" name="Image17" width="188" height="12" border="0" class="navBut" id="Image17" /></a><a href="amisafe.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image16','','images/b_safe1.gif',1)"><img src="images/b_safe.gif" name="Image16" width="188" height="12" border="0" class="navBut" id="Image16" /></a><br />
<a href="johnny.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image18','','images/b_jonny1.gif',1)"><img src="images/b_jonny.gif" name="Image18" width="188" height="12" border="0" class="navBut" id="Image18" /></a><br />
<a href="links.html" onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Image19','','images/b_links1.gif',1)"><img src="images/b_links.gif" name="Image19" width="188" height="12" border="0" class="navBut" id="Image19" /></a><br />
</div>
<img src="images/i_nav_bot.gif" alt="Share The Love" style="margin:0; padding:0;" />
</div>

<div id="right"><img src="images/main_what.gif" width="447" height="78" /><div class="whiteBG"><br />
<div align="center"><img src="images/pics/couple.JPG" width="266" height="186" /><br />
<div class="contentText"> <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:400px;height:90px;border:1px solid white;overflow:hidden">')
document.write('<div id="content" style="position:absolute;width:400px;left:0;top:0">')
}
</script>

</div>
<br />
<ilayer name="nscontainer" left="17" top="22" width=400 height=90 clip="0,0,400,160">
<layer name="nscontent" left="1" top="1" width=400 height=90 visibility=hidden>

<div align="left">

<br />
<br />
<br />
Chlamydia...Your local GP will be able to do this for you or you can go to your nearest clinic. You will be advised to avoid any sexual contact for at least a week after your treatment has ended

If the sample comes back from the lab as positive, it can be treated with a course of antibiotics.
If a mother passes it onto her baby at birth, both mother and baby can be treated with antibiotics.

To stop the infection spreading further, you need to inform sexual partners from the past 3 to 6 months, advising them to get tested. Keep in mind the different ways it would be contracted.
Remember, even if you haven’t had sex with these partners, they could have caught it or given it to you from touching your genitals or from oral sex.
<br />
</div>
</layer>
</ilayer>

<script language="JavaScript1.2">
if (iens6)
document.write('</div></div>')
</script>
<br />
<table width="400"><td width="400" height="7"><p align="right">
<a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img src="images/up.gif" width="9" height="5" border="0" /></a> <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)"><img src="images/down.gif" width="9" height="5" border="0" /></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"
}

</script>
<br />
</div>
</div>
<img src="images/i_content_bot.gif" alt="Share The Love" /></div>

<br class="clearBoth" />


</div>


</div>


</div>

</body>
</html>

**jscheuer1** · 05-03-2007, 06:47 PM

One or more of your meta tags could be causing problems. Get rid of those as a test to see. If you need more help, a link to the live problem page or to a live page that demonstrates the problem would make our job much easier.

**dench82** · 05-03-2007, 06:58 PM

Originally Posted by jscheuer1

One or more of your meta tags could be causing problems. Get rid of those as a test to see. If you need more help, a link to the live problem page or to a live page that demonstrates the problem would make our job much easier.

iv tried removing the meta tags but it doesnt make a diff

i dont have the site live at the moment tho

any other way you can fix it?

could i send you the file some how?