PDA

View Full Version : Scrollable content script II



xJBx
10-10-2011, 07:10 AM
1) Script Title: Scrollable content script II- Dynamic Drive

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex11/scrollc2.htm

3) Describe problem: When i scroll down all the text disappears to the top, but is it possible to put in a code to the script that when the last text is visible that the scrolling stops.

vwphillips
10-10-2011, 08:39 AM
<!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>
<title></title>
</head>

<body>


<div id="container" style="position:relative;width:175px;height:160px;border:1px solid black;overflow:hidden">
<div style="position:absolute;width:170px;left:0;top:0">


<!--INSERT CONTENT HERE-->
<p><font size="2" face="Arial">-</font><font size="2" face="Arial"> DHTML is the
combination of HTML, JavaScript, and CSS</font></p>
<p><font size="2" face="Arial">- DOM stands for Document Object Model</font></p>
<p><font size="2" face="Arial">-</font><font size="2" face="Arial"> DHTML allows
content on a page to change on the fly, without reloading the page</font></p>
<p><font size="2" face="Arial">- CSS allows for the separation between content
definition and formatting</font></p>
<p><font size="2" face="Arial">- CSS stands for Cascading style sheet</font></p>
<p><font size="2" face="Arial">- </font><font size="2" face="Arial"><a href="http://www.dynamicdrive.com">Dynamic
Drive</a> provides free, cut and paste DHTML scripts</font></p>
<!--END CONTENT-->

</div></div>

<table width="175px"><td><p align="right">
<a href="#" onMouseover="moveup()" onMouseout="clearTimeout(moveupvar)"><img src="http://www.dynamicdrive.com/dynamicindex11/up.gif" border=0></a> <a href="#" onMouseover="movedown()" onMouseout="clearTimeout(movedownvar)"><img src="http://www.dynamicdrive.com/dynamicindex11/down.gif" border=0></a></p></td>
</table>

<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
******************************************/


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



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

function moveup(){
if (parseInt(crossobj.style.top)<=0){
crossobj.style.top=parseInt(crossobj.style.top)+speed+"px"
}
moveupvar=setTimeout("moveup()",20);
}

function getcontent_height(){
var p=document.getElementById("container");
crossobj=p.getElementsByTagName('DIV')[0];
contentheight=crossobj.offsetHeight-p.offsetHeight;
}

window.onload=getcontent_height
</script>
</body>

</html>

xJBx
10-10-2011, 10:10 AM
Tanks for the help