Ir para conteúdo

POWERED BY:

Arquivado

Este tópico foi arquivado e está fechado para novas respostas.

Andreia Regina

Scroll na div

Recommended Posts

Oi!

 

Estou com dificuldade em fazer o seguinte script funcionar no Firefox, Opera e Netscape, no IE funciona certinho e deveria funcionar nos outros pois testei o script antes de alterar na minha página, segue:

 

parte css:

#aniversariantes {position: absolute;overflow: hidden;botton: 330px;right: 5px;background-color: #FFFFE8;width:95%;height: 260px;font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 10px;font-weight:bold;color:#000;padding-left:5px}#Scroller-1 {position: absolute;overflow: hidden;botton: 330px;right: 5px;width: 90%;height: 260px}#Scroller-1 p {font-family:Verdana, Arial, Helvetica, sans-serif;font-size: 10px;font-weight:bold;color:#000}.Scroller-Container {position: absolute;top: 0px;right: 0px;}.Scrollbar-Up {cursor: pointer;position: absolute;top: 10px;right: 5px}.Scrollbar-Down {cursor: pointer;position: absolute;top: 215px;right: 5px}

javascript no arquivo index:

<script type="text/javascript" src="jsScroller.js"></script><script language="JavaScript"><!--var scroller = null;window.onload = function () {var el = document.getElementById("Scroller-1");scroller = new jsScroller(el, 400, 200);}//--></script>

html:

<div id=aniversariantes><img src="imagens/seta_up.gif" alt="Subir" class="Scrollbar-Up" onmouseover="scroller.startScroll(0, 5);" onmouseout="scroller.stopScroll();" /><img src="imagens/seta_down.gif" alt="Descer" class="Scrollbar-Down" onmouseover="scroller.startScroll(0, -5);" onmouseout="scroller.stopScroll();" />	  <div id="Scroller-1"><div class="Scroller-Container">	<p align="center" class="anivers"> <strong>Feliz Aniversário:<br /></strong></p>	Nome dos aniversariantes vindo do bd   </div>   <!-- Scroller-1 --> </div>	<!-- Scroller-Container -->	</div>	<!-- aniversariantes -->

Arquivo javascript com a função toda:

//Written by Nathan Faubion: http://n-son.com//Use this or edit how you want, just give me//some credit!function jsScroller (o, w, h) {var self = this;var list = o.getElementsByTagName("div");for (var i = 0; i < list.length; i++) {if (list[i].className.indexOf("Scroller-Container") > -1) {o = list[i];}}//Private methodsthis._setPos = function (x, y) {if (x < this.viewableWidth - this.totalWidth)x = this.viewableWidth - this.totalWidth;if (x > 0) x = 0;if (y < this.viewableHeight - this.totalHeight)y = this.viewableHeight - this.totalHeight;if (y > 0) y = 0;this._x = x;this._y = y;with (o.style) {left = this._x +"px";top = this._y +"px";}};//Public Methodsthis.reset = function () {this.content = o;this.totalHeight = o.offsetHeight;this.totalWidth = o.offsetWidth;this._x = 0;this._y = 0;with (o.style) {left = "0px";top = "0px";}};this.scrollBy = function (x, y) {this._setPos(this._x + x, this._y + y);};this.scrollTo = function (x, y) {this._setPos(-x, -y);};this.stopScroll = function () {if (this.scrollTimer) window.clearInterval(this.scrollTimer);};this.startScroll = function (x, y) {this.stopScroll();this.scrollTimer = window.setInterval(function(){ self.scrollBy(x, y); }, 40);};this.swapContent = function (c, w, h) {o = c;var list = o.getElementsByTagName("div");for (var i = 0; i < list.length; i++) {if (list[i].className.indexOf("Scroller-Container") > -1) {o = list[i];}}if (w) this.viewableWidth = w;if (h) this.viewableHeight = h;this.reset();};//variablesthis.content = o;this.viewableWidth = w;this.viewableHeight = h;this.totalWidth = o.offsetWidth;this.totalHeight = o.offsetHeight;this.scrollTimer = null;this.reset();};

Link do código: aqui

 

Desde já agradeço

 

Andreia Regina

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oi!Eu já havia tentado fazer a rolagem direto na div mas, não sei pq não funcionou no firefox os nomes continuaram mesmo sem a div se extender, então tentei de outra forma.Obrigada

Compartilhar este post


Link para o post
Compartilhar em outros sites

Oi!Eu já havia tentado fazer a rolagem direto na div mas, não sei pq não funcionou no firefox os nomes continuaram mesmo sem a div se extender, então tentei de outra forma.Obrigada

você poderia usar o seguinte: overflow: auto; > coloca o scroll automaticamente overflow-y: scroll; > coloca o scroll so na vertical overflow-x:hidden; > esconde o scroll horizontaltenta ae, no FF 1.5 funcionou legal e no IE6 tb--------------------------------- :) :) :)

Compartilhar este post


Link para o post
Compartilhar em outros sites

×

Informação importante

Ao usar o fórum, você concorda com nossos Termos e condições.