Avatar Image
Usuario habitual
Usuario habitual

Hola. Me gustaría saber si éste código DHTML: http://flanagan.ugr.es/dhtml/ejemplos/scroll.htm ¿os funciona en Firefox o no?

Si abro la página en I.Explorer funcionan perfectamente los botones, pero con la última versión de Firefox (1.5.0.3) los botones no responden.

No sé si hay que hacer alguna modificación para que el firefox comprenda el código, o si, simplemente, sólo funciona en iexplore.

Avatar Image
@man / @woman
@man / @woman

La consola de javascript indica varios errores al ejecturarse tu código... por eso no funciona.

Avatar Image
Usuario habitual
Usuario habitual

Gracias por la respuesta tan rápida. Entonces el problema es del código y no del navegador no?

Bueno, el código no es mío, es de esta página http://flanagan.ugr.es/dhtml/dhtml7.htm. Sería muy difícil depurar el código para que funcionase correctamente? (no sé nada sobre javascript). Gracias

Avatar Image
@man / @woman
@man / @woman
Escrito originalmente por lythium
Gracias por la respuesta tan rápida. Entonces el problema es del código y no del navegador no?


Del navegador no suele ser... lo que ocurre es que cada navegador interpreta el javascript y otros elementos de distinta manera.... por eso, entre otras cosas, es díficil hacer cosillas complejas.

Pero la consola de javascript te dice que el código tiene fallos, por lo que tendrás que solucionarlos... después, pues ya se vería el resto del código.
Avatar Image
Usuario habitual
Usuario habitual

Según la consola javascript, toque el link que toque, indica "n is not defined" en las líneas 75, 100, 105 y 126, .

No sé programar en javascript, ¿crees que es muy dificil solucionar esto?

Avatar Image
@man / @woman
@man / @woman

Yo de JS lo justo... pero al inicio por un var n; o algo similara para definirlo.

Avatar Image
Okupa del foro
Okupa del foro

En Opera funciona perfektamente tambien... por si sirve de algo

Avatar Image
@man / @woman
@man / @woman
Escrito originalmente por ArTMOSaik
En Opera funciona perfektamente tambien... por si sirve de algo


Liar mas la cosa... y si a eso le añadimos que cada versión de IE funciona diferente... cada uno se pasa los estándares por...
Avatar Image
Usuario habitual
Usuario habitual

Gracias por las respuestas. Al final he conseguido otro código que he modificado con lo poco que sé. El problema lo he tenido al tener que insertar dos javascript en un mismo OnLoad, pero buscando he visto que insertando un ";" separando los dos scripts, se cargaban perfectamente en la página.

tunait
Usuario habitual
Usuario habitual

Buenas,

ya veo que lo has resuelto usando otro script.

Igual me he entretenido en echarle un vistazo al que tenías. Es normal que sólo funcionara en Explorer pues la forma de detectar navegadores es muy anticuada en ese script.

Igual a quien interese dejo el script modificado para funcionar en navegadores actuales.

Dejo el html completo por si eliminas el ejemplo del servidor

Codigo:

<HTML>
<HEAD>
<TITLE>C&oacute;mo hacer scroll</TITLE>
<STYLE TYPE="text/css"><!--
A {color:#FFFFFF; font-family:'Arial'; font-size:10pt; line-height:20pt;}
A.scroll {font-size:9pt; line-height:11pt;}
A.hideshow {color:#000000}
STRONG {font-family:'Arial'; font-size:15pt; font-weight:bold;}
P {font-family:'Arial'; font-size:11pt; line-height:13pt;}
P.blue {color:#330099}
P.green {color:#666600}
P.purple {color:#800080}
P.brown {color:#804000}
#principal {
position:absolute;
left:50; top:70;
width:400; height:250;
clip:rect(0,400,250,0);
background-color:#6B6B6B;
layer-background-color:#6B6B6B;
visibility:visible;}

#menuelem {
position:absolute;
left:10; top:0;
width:90; height:250;}

#desplazar {
position:absolute;
left:10; top:205; width:90;}

#elementos {
position:absolute;
left:110; top:3;
width:287; height:244;
clip:rect(0,287,244,0);
background-color:#BDBDBD;
layer-background-color:#BDBDBD;}

#elem1 {
position:absolute;
left:5; top:0;
width:278;
visibility:visible;}

#elem2 {
position:absolute;
left:5; top:0;
width:278;
visibility:hidden;}

#elem3 {
position:absolute;
left:5; top:0;
width:278;
visibility:hidden;}
-->
</STYLE>
<SCRIPT LANGUAGE="JavaScript"><!--

n=1;ie=0
n=0;ie=1

function init() {
scrollActive = 0
scrollLimit = -200
scrollContentShown = "elem1"
}

function Scroll(direction) {
if (scrollActive) {
var postop = document.getElementById(scrollContentShown).style.top
postop = new Number(postop.replace(/px/,""))
if (direction == "up" && postop < 0) { // ver si ya esta arriba del todo
var inc = 10 // mover de 10 en 10 px
obj =document.getElementById(scrollContentShown)
obj.style.top = postop + inc + "px"
setTimeout("Scroll('up')",20)
}

if (direction == "down" && postop > scrollLimit) { // ver si ya esta abajo del todo
var inc = -10 // mueve de 10 en 10 px
obj = document.getElementById(scrollContentShown)
obj.style.top = postop + inc
// alert(obj.style.top)
setTimeout("Scroll('down')",20)
}
}
}
//que elemento / el maximo de px a dexplazarlo
function scrollChange(which,limit) {
document.getElementById(scrollContentShown).style.visibility = 'hidden'
document.getElementById(which).style.visibility = 'visible'
scrollContentShown = which
scrollLimit = limit
}
function showobj(showobj) {
document.getElementById(showobj).style.visibility = 'visible'
}

function hideobj(hideobj) {
document.getElementById(hideobj).style.visibility = 'hidden'
}
//--></SCRIPT>
</HEAD>
<BODY BGCOLOR="#FFFFFF" TEXT="#000000" LINK="#0000FF" onLoad="init()">


<A CLASS="hideshow" HREF="javascript:showobj('principal')">Muestra</A>
<A CLASS="hideshow" HREF="javascript:hideobj('principal')">Oculta</A>
<DIV ID="principal">
<DIV ID="menuelem">
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH=90><TD ALIGN=RIGHT>
<A HREF="javascript:scrollChange('elem1',-200)">1 ELEMENTO</A><br>
<A HREF="javascript:scrollChange('elem2',-200)">2 ELEMENTO</A><br>
<A HREF="javascript:scrollChange('elem3',-200)">3 ELEMENTO</A>
</TD></TABLE>
</DIV>
<DIV ID="elementos">
<DIV ID="elem1">
<STRONG>Item 1</STRONG>
<P CLASS="blue">
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
Esto es el texto de relleno del primer (1) elemento del scroll &#191;te lo repito?
</P>
</DIV>
<DIV ID="elem2">
<STRONG>Item 2</STRONG>
<P CLASS="green">
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
Esto es el texto de relleno del segundo (2) elemento del scroll.
</P>
</DIV>
<DIV ID="elem3">
<STRONG>Item 3</STRONG>
<P CLASS="purple">
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
Esto es el texto de relleno del TERCERO (3) elemento del scroll.
</P>
</DIV>
</DIV>
<DIV ID="desplazar">
<TABLE BORDER=0 CELLSPACING=0 CELLPADDING=0 WIDTH=90><TD ALIGN=RIGHT>
<A CLASS="scroll" HREF="javascript:void(null)"
onMouseDown="scrollActive=1;Scroll('up')"
onMouseUp="scrollActive=0" onMouseOut="scrollActive=0">ARRIBA</A>
<BR><A CLASS="scroll" HREF="javascript:void(null)"
onMouseDown="scrollActive=1;Scroll('down')"
onMouseUp="scrollActive=0" onMouseOut="scrollActive=0">ABAJO</A>
</TD></TABLE>
</DIV>
</DIV>
</BODY>
</HTML>


Un saludo :-)
Avatar Image
Usuario habitual
Usuario habitual

Muchas gracias tunait! Aunque no lo creas, me has hecho un favor. Te explico.
Usé otro script, que en teoría funcionaba perfectamente, hasta que me he percatado de un problema: Al hacer scroll del texto en una pantalla que no sea 1280x1024 (que es como yo trabajo) el texto baja a la vez que la página completa sube, y además el cuadro de texto aparece corrido a la izquierda.
Claro, al haberle marcado un lugar exacto en píxeles a la capa, al ver la página en otra pantalla, saltan de sitio. ¿Habría alguna forma de cambiarlo?
Si abro la página en una pantalla 1280x1024 se ve bien, peeero al hacer scroll, hay como un salto extraño

He subido la página para que lo veas: http://perfume.ekuseru.net/index1.html

De todos modos, veo que has reparado el código, te lo agradezco muchísimo! Lo implantaré ahora a ver cómo queda.
Un saludo y gracias de nuevo.

Avatar Image
Usuario habitual
Usuario habitual

He insertado el código que has puesto y ha quedado así:

http://perfume.ekuseru.net/index2.html

Funciona, pero vuelve a surgirme el problema que he comentado antes. Depende del tamaño de la ventana del explorador, la capa se coloca en una posición fija. Entonces pregunto,

¿Es posible fijar una capa dentro de una tabla?

uf, esto me está dando dolor de cabeza Llorica

Avatar Image
Usuario habitual
Usuario habitual

He estado buscando una solución, y he encontrado el ejemplo de lo que me pasa en otra web (por si sirve de ayuda):

http://experts.about.com/q/Javascript-1520/fix-layer-position-1.htm

La respuesta que han dado al problema con esta página es hacer varias páginas, una por cada resolución de pantalla, pero no lo veo buena solución, porque el problema también surge cuando la ventana cambia de tamaño, y la resolución de pantalla aquí no influye.

Sigo buscando una solución, espero que alguien sepa ayudarme.

Avatar Image
Usuario habitual
Usuario habitual

Solucionado.

Por si a alguien le interesa, aquí está la solución:

http://www.webdeveloper.com/forum/archive/index.php/t-9486.html

ATENCIÓN: Este tema no tiene actividad desde hace más de 6 MESES,
te recomendamos abrir un nuevo tema en lugar de responder al actual
Opciones:
Ir al subforo:
Permisos:
TU NO PUEDES Escribir nuevos temas
TU NO PUEDES Responder a los temas
TU NO PUEDES Editar tus propios mensajes
TU NO PUEDES Borrar tus propios mensajes
Temas similares
No se han encontrado temas similares