Scroll Em Javascript?

Setembro 23, 2005

Pow galera,, eu tava precisando monta um esquema tipow, pra rolar o texto, passando o mouse

sobre o link,, com onmouseover, beleza, achei um script pronto, e

coloquei pra testar,, mas dae veio o problema, no IE, deu tudo certo,,

mas no firefox,, não vai,, será que o firefox não aceita isso,, ou

tem conserto pelo código,, valeu,, awe,, to

mandando o código pra galera dar uma olhada,, falou, obrigado!!

<html>

<head>

<title>teste</title>

#divControl{position:absolute; width:250; font-family:arial;

left:120; top:190; font-size:10px; visibility:hidden}

#divCont{position:absolute; top:250; left:120; clip:rect(0,250,150,0);

height:150; width:250}

.clScroll{position:absolute; top:0; font-size:10px; left:0;

font-family:arial; visibility:hidden}

A:link {color: ff0000; text-decoration: none }

A:visited {color: 545454; text-decoration: none}

A:active {color: 545454; text-decoration: none}

A:hover {color: c0c0c0; text-decoration: underline}

</style>

function checkBrowser(){

this.ver=navigator.appVersion

this.dom=document.getElementById?1:0

this.ie6=(this.ver.indexOf("MSIE 6")>-1 && this.dom)?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.ie6 || 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

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

}

/*********************************************************************************

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

}

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

</HEAD>

<div id="divControl"><font color="000000" face="verdana, Times New

Roman, Times, serif" size="2pt">

<a href="#" onmouseover="scroll(-5)" onmouseout="noScroll()">desce</a>

</div>

Esta é a pagina 1, você pode colocar o mouse sobre o link

sobe ou desce para movimentar o texto.<BR><BR>

Se você preferir pode escolher entre Page 1, 2, 3 ou 4 para ver outros

textos.<BR><BR>

Este recurso é muito bom para quem quer colocar algum tipo de news no site!

Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto Texto

</td></tr></table>

Página 2 Página 2 Página 2 Página 2 Página 2 Página 2 Página 2

Página 2 Página 2 Página 2 Página 2 Página 2 Página 2

</div>

Página 3 Página 3 Página 3 Página 3 Página 3 Página 3 Página 3

Página 3 Página 3 Página 3 Página 3 Página 3 Página 3

</div>

Página 4 Página 4 Página 4 Página 4 Página 4 Página 4 Página 4

Página 4 Página 4 Página 4 Página 4 Página 4 Página 4

</div>

<form>

<input type="button"

value="Código Fonte"

onClick="window.location = "view-source:" +

window.location.href" name="button"

>

</font>

</form>

<p align="center"><font color="000000" face="verdana, Times New Roman,

Times, serif" size="2pt"><b>Java + Java</b></font></p>

</BODY>

</HTML>

OSJunior · Setembro 24, 2005

Acrescente isso na sua CSS:

div {
-moz-box-sizing:border-box;
box-sizing:border-box;
}

Entrar

Scroll Em Javascript?

Pergunta

Guest John.Ribey

Link para o comentário

Compartilhar em outros sites

1 resposta a esta questão

Posts Recomendados

OSJunior

Link para o comentário

Compartilhar em outros sites

Participe da discussão

Estatísticas dos Fóruns

Navegação

Atividades