<STYLE type=text/css>#divControl
{
FONT-FAMILY: arial; FONT-SIZE: 10pt; LEFT: 120px;
POSITION: absolute; TOP: 190px; VISIBILITY: hidden; WIDTH: 250px
}
#divCont {
CLIP: rect(0px 250px 150px 0px); HEIGHT: 150px; LEFT: 120px;
POSITION: absolute; TOP: 250px; WIDTH: 250px
}
.clScroll {
FONT-FAMILY: arial; FONT-SIZE: 10pt; LEFT: 0px; POSITION:
absolute; TOP: 0px; VISIBILITY: hidden
}
</STYLE> <SCRIPT language=JavaScript
type=text/javascript>
/********************************************************************************
Copyright (C) 1999 Thomas Brattlihttp://www.bratta.com/הפמ
חוקל טפירקסה
This script is made by and copyrighted to Thomas Brattli at www.bratta.com
Visit for more great scripts. This may be used freely as long as this
msg is intact!
I will also appriciate any links you could give me.
********************************************************************************/
//Default browsercheck, added to all scripts!
function checkBrowser(){
this.ver=navigator.appVersion
this.dom=document.getElementById?1:0
this.ie5=(this.ver.indexOf("MSIE 5")>-1 && this.dom)?1:0;
this.ie4=(document.all && !this.dom)?1:0;
this.ns5=(this.dom && parseInt(this.ver) >= 5) ?1:0;
this.ns4=(document.layers && !this.dom)?1:0;
this.bw=(this.ie5 || this.ie4 || this.ns4 || this.ns5)
return this
}
bw=new checkBrowser()
/*********************************************************************************
These are the variables you have to set:
*********************************************************************************/
//The speed of the timeout between each scroll.
timSpeed=50
//The height of the container (change this when it scrolls
to much or to little)
contHeight=100
/*********************************************************************************
This is the object constructor function, which applies
methods and properties to the Cross-browser layer object
*********************************************************************************/
function makeScrollObj(obj,nest){
nest=(!nest) ? '':'document.'+nest+'.'
this.el=bw.dom?document.getElementById(obj):bw.ie4?document.all[obj]:bw.ns4?eval(nest+'document.'+obj):0;
this.css=bw.dom?document.getElementById(obj).style:bw.ie4?document.all[obj].style:bw.ns4?eval(nest+'document.'+obj):0;
this.height=bw.ns4?this.css.document.height:this.el.offsetHeight
this.top=b_gettop
return this
}
//Getting the top for the top method
function b_gettop(){
var gleft=(bw.ns4 || bw.ns5) ? eval(this.css.top):eval(this.css.pixelTop);
return gleft;
}
//Variables
var scrollTim;
var active=0;
/*********************************************************************************
The scroll function. Checks what way to scroll and checks if the
layer is not already on top or bottom.
*********************************************************************************/
function scroll(speed){
clearTimeout(scrollTim)
way=speed>0?1:0
if((!way && oScroll[active].top()>-oScroll[active].height+contHeight)
|| (oScroll[active].top()<0 && way)){
oScroll[active].css.top=oScroll[active].top()+speed
scrollTim=setTimeout("scroll("+speed+")",timSpeed)
}
}
//Clears the timeout so the scroll stops, this is called onmouseout.
function noScroll(){
clearTimeout(scrollTim)
}
/*********************************************************************************
Changes the active layer. Hides the one that's visible and
shows the "new" one. Also set's the new layers top to
0 so it starts at top.
*********************************************************************************/
function changeActive(num){
oScroll[active].css.visibility='hidden'
active=num
oScroll[active].css.top=0
oScroll[active].css.visibility='visible'
}
/*********************************************************************************
Initilizes the page, makes a oScroll Array and calls the object constructor.
Here you can add as many scrollObjects as you want
*********************************************************************************/
function scrollInit(){
oScroll=new Array()
oScroll[0]=new makeScrollObj('divScroll1','divCont')
oScroll[1]=new makeScrollObj('divScroll2','divCont')
oScroll[2]=new makeScrollObj('divScroll3','divCont')
oScroll[3]=new makeScrollObj('divScroll4','divCont')
oScroll[0].css.visibility='visible'
oControl=new makeScrollObj('divControl')
oControl.css.visibility='visible'
}
/*********************************************************************************
Executes the scrollInit function on pageload.
*********************************************************************************/
onload=scrollInit;
</SCRIPT>
<DIV id=divControl><A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onclick=changeActive(0)>Page 1</A> <A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onclick=changeActive(1)>Page 2</A> <A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onclick=changeActive(2)>Page 3</A> <A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onclick=changeActive(3)>Page 4</A> <BR><BR><A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onmouseout=noScroll() onmouseover=scroll(5)>up</A> <A
href="http://www.bratta.com/dhtml/scripts/source.asp?id=24&sourced=33863#"
onmouseout=noScroll() onmouseover=scroll(-5)>down</A> </DIV>
<DIV id=divCont>
<DIV class=clScroll id=divScroll1>This is "page" 1, here
you place some content.
You should place more content then this or it won't
scroll..blablablabl<BR><BR>text text dummy texttext text dummy
texttext text
dummy text<BR><BR>text text dummy text text text dummy text
text text dummy text
<BR></DIV>
<DIV class=clScroll id=divScroll2>This is "page" 2...........
<BR>text textdummy
texttext text dummy texttext text dummy text<BR><BR>text text
dummy text text
text dummy text text text dummy text <BR>text text dummy texttext
text dummy
texttext text dummy text<BR><BR>text text dummy text text
text dummy text text
text dummy text <BR><BR>text textdummy texttext text dummy
texttext text dummy
text<BR><BR>text text dummy text text text dummy text text
text dummy text
<BR>text text dummy texttext text dummy texttext text dummy text<BR><BR>text
text dummy text text text dummy text text text dummy text <BR></DIV>
<DIV class=clScroll id=divScroll3>This is "page" 3...........(can't
scroll this
one, to little content) <BR></DIV>
<DIV class=clScroll id=divScroll4>Page 4 text text dummy texttext
text dummy
texttext text dummy text<BR><BR>ext text dummy texttext text
dummy texttext text
dummy text<BR><BR>text text dummy texttext text dummy texttext
text dummy
text<BR><BR>text text dummy texttext text dummy texttext text
dummy
text<BR><BR>text text dummy texttext text dummy texttext text
dummy
text<BR></DIV></DIV>
|