Foros del Web » Programando para Internet » Javascript »

Quien me ayuda con esto....

Estas en el tema de Quien me ayuda con esto.... en el foro de Javascript en Foros del Web. Verán estube tratando de unir diferentes script para tener uno solo con estas características: * Que las imágenes se visualicen en marquee (opción slide, 1 ...
  #1 (permalink)  
Antiguo 26/12/2002, 16:38
Avatar de medinauta  
Fecha de Ingreso: diciembre-2002
Ubicación: Guayaquil
Mensajes: 159
Antigüedad: 21 años, 4 meses
Puntos: 0
Marquee para imágenes

Verán estube tratando de unir diferentes script para tener uno solo con estas características:

* Que las imágenes se visualicen en marquee (opción slide, 1 sola vez para que se oculten las que no entran en la pantalla (la marquesina corre hasta llegar a la última y las primeras no quedan a la vista)
* Que tengan vínculos, en onMouseOver se detenga y en onMouseOut continúe donde se quedó la marquesina
* Efecto "Fade" en las imágenes
* Con Controles (aquí es el relajo de todo esto):
Los controles sirven para hacer avanzar o retroceder la marquesina, osea que la imágen inicial que estaba oculta se visualice al mover la imagen de una flecha hacia adelante o atrás...

Pero no puedo hacer que la marquesina siga desde donde se quedó, osea le cambio la opción "behavior" de "slide" a "scroll", todo perfect, al salir de alguno de los controles (atras o adelante) le cambio nuevamente el behavior a "slide"(para que no siga), pero lo que pasa es que al hacerlo se corta el scroll y empieza desde cero con el comportamiento de slide.

Este es el código:

********************
<html>
<head>
<script language="JavaScript1.2">
// Efecto highlight
function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}
// fin efecto higlight
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<table width="767" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29" height="73" valign="top"><img src="tmp/triangle.gif" width="14" height="54" align="top" onMouseOver="scrolldir()" onMouseOut="scrollplay()"></td>
<td width="706" valign="top">
<script language=JavaScript1.2>
<!-- Inicia Script 1
var ostat = false;
function scrollstop() {
news.scrollAmount = 0;
ostat = true;
}
function scrollplay() {
news.scrollAmount = vitessevisio;
news.behavior="slide";
news.onmouseout=new Function("if (document.readyState=='complete') news.scrollAmount=vitessevisio")
ostat = false;
}

function scrolldir() {
mid = screen.width / 2;
mouse = event.x;
if(mouse > mid) {
if(ostat == false)
{speed = vitessevisio * 4;
news.scrollAmount = speed;}
news.direction = "right";
news.behavior="scroll"}
else {
if(ostat == false)
{speed = vitessevisio * 4;
news.scrollAmount = speed;}
news.direction = "left";
news.behavior="scroll";
}
}
// End --> del Script 1
</script>
<script language=JavaScript1.2>
<!-- scroll de imagenes -- Script 2
// Image scrolling speed
var vitessevisio=10

// Images presented through the viewer
var visio_gd=new Array()
var visio_final=''
visio_gd[0]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[1]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[2]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[3]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[4]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[5]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[6]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'

var copyspeed=vitessevisio

// Copies all visio_gd[ ] elements' values in one variable
for (i=0;i<visio_gd.length;i++)
visio_final = visio_final + visio_gd[i]

if (document.all)
{
// Dynamic creation of MARQUEE tag id="ieslider"
document.write('<marquee name="news" id="news" scrollAmount=0 style="width:100%" HEIGHT=100%" behavior="slide" direction="left" scrolldelay=1 hspace=0 vspace=0 onmouseover="scrollstop()" onmouseout="scrollplay()" ALIGN="top">'+visio_final+'</marquee>')

// Stops MARQUEE when mouse pointer is over it
// news.onmouseover=new Function("news.scrollAmount=0")

// Resumes MARQUEE scrolling when mouse pointer leaves
// news.onmouseout=new Function("if (document.readyState=='complete') news.scrollAmount=vitessevisio")
}

function regenere_visio()
{
window.location.reload()
}

//function regenere_visio2()
{
if (document.layers)
{
document.ns_slider01.visibility="show"
setTimeout("window.onresize=regenere_visio",450)
init_visio()
}

if (document.all)
news.scrollAmount=vitessevisio
}

//NS specific function for initialising the presentation upon page load
function init_visio()
{
document.ns_slider01.document.ns_slider02.document .write('<nobr>'+visio_final+'</nobr>')
document. ns_slider01.document.ns_slider02.document.close()
thelength=document.ns_slider01.document.ns_slider0 2.document.width
scrollslide()
}

//NS specific function for scrolling the images
function scrollslide()
{
if (document.ns_slider01.document.ns_slider02.left>=t helength*(-1))
{
document.ns_slider01.document.ns_slider02.left-=vitessevisio
setTimeout("scrollslide()",100)
}
else
{
document.ns_slider01.document.ns_slider02.left=lar gvisio
scrollslide()
}
}

//window.onload=regenere_visio2

//--> Fin Script 2
</script>
</td>
<td width="32" valign="top"><img src="tmp/triangle2.gif" width="14" height="54" align="top" onMouseOver="scrolldir()" onMouseOut="scrollplay()"></td>
</tr>
</table>
</body>
</html>
*****************
Avísenme que le puedo hacer para limpiarlo ya que hice esto uniendo como 3 scripts diferentes y como ven hay cosas que ya no necesito (creo...) y no sé qué partes borrar para abreviarlo.

Por favor revisen este código y ayúdenme, se los agradeceré muchísimo, si no hay como... Alguno sabe entonces como hacerle para que dejándolo en scroll (omitiendo los controles esos), como hacer para que sea continuo, osea que no espere a que desaparezca la última imágen para que aparezca la primera, sino que junto a la última imágen apareza detrás la primera y así sea un scroll eterno, sin principio ni fin.

Medio loco o muy exigente, pero estas cosas son las que traen el progreso.

Última edición por medinauta; 26/12/2002 a las 18:00
  #2 (permalink)  
Antiguo 26/12/2002, 22:15
 
Fecha de Ingreso: diciembre-2001
Ubicación: Madrid
Mensajes: 889
Antigüedad: 22 años, 4 meses
Puntos: 4
Cita:
Pero no puedo hacer que la marquesina siga desde donde se quedó, osea le cambio la opción "behavior" de "slide" a "scroll", todo perfect, al salir de alguno de los controles (atras o adelante) le cambio nuevamente el behavior a "slide"(para que no siga), pero lo que pasa es que al hacerlo se corta el scroll y empieza desde cero con el comportamiento de slide.
Ten ese arreglo:
<html>
<head>
<script language="JavaScript1.2">
// Efecto highlight
function makevisible(cur,which){
strength=(which==0)? 1 : 0.2

if (cur.style.MozOpacity)
cur.style.MozOpacity=strength
else if (cur.filters)
cur.filters.alpha.opacity=strength*100
}
// fin efecto higlight
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000">
<table width="767" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="29" height="73" valign="top"><img src="tmp/triangle.gif" width="14" height="54" align="top" onMouseOver="scrolldir()" onMouseOut="scrollplay()"></td>
<td width="706" valign="top">
<script language=JavaScript1.2>
<!-- Inicia Script 1
var ostat = true;
function scrollstop() {
news.scrollAmount = 0;
ostat = true;}

function scrollplay() {
news.scrollAmount = vitessevisio;
news.onmouseout=new Function("if (document.readyState=='complete') news.scrollAmount=vitessevisio")
ostat = false;
}

function scrolldir() {
mid = screen.width / 2;
mouse = event.x;
if(mouse > mid) {
if(ostat == false)
{speed = vitessevisio * 4;
news.scrollAmount = speed;}
news.direction = "right";
news.behavior="scroll"}
else {
if(ostat == false)
{speed = vitessevisio * 4;
news.scrollAmount = speed;}
news.direction = "left";
news.behavior="scroll";
}
}
// End --> del Script 1
</script>
<script language=JavaScript1.2>
<!-- scroll de imagenes -- Script 2
// Image scrolling speed
var vitessevisio=10

// Images presented through the viewer
var visio_gd=new Array()
var visio_final=''
visio_gd[0]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[1]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[2]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[3]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[4]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[5]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'
visio_gd[6]='<a href="milink.html"><img src="tmp/lamina.jpg" width="150" height="76" border="0" style="filter:alpha(opacity=20);-moz-opacity:0.2" onMouseover="makevisible(this,0)" onMouseout="makevisible(this,1)"></a>'

var copyspeed=vitessevisio

// Copies all visio_gd[ ] elements' values in one variable
for (i=0;i<visio_gd.length;i++)
visio_final = visio_final + visio_gd[i]

if (document.all)
{
// Dynamic creation of MARQUEE tag id="ieslider"
document.write('<marquee name="news" id="news" scrollAmount=0 style="width:100%" HEIGHT=100%" behavior="slide" direction="left" scrolldelay=1 hspace=0 vspace=0 onmouseover="scrollstop()" onmouseout="scrollplay()" ALIGN="top">'+visio_final+'</marquee>')

// Stops MARQUEE when mouse pointer is over it
// news.onmouseover=new Function("news.scrollAmount=0")

// Resumes MARQUEE scrolling when mouse pointer leaves
// news.onmouseout=new Function("if (document.readyState=='complete') news.scrollAmount=vitessevisio")
}

function regenere_visio()
{
window.location.reload()
}

//function regenere_visio2()
{
if (document.layers)
{
document.ns_slider01.visibility="show"
setTimeout("window.onresize=regenere_visio",450)
init_visio()
}

if (document.all)
news.scrollAmount=vitessevisio
}

//NS specific function for initialising the presentation upon page load
function init_visio()
{
document.ns_slider01.document.ns_slider02.document .write('<nobr>'+visio_final+'</nobr>')
document. ns_slider01.document.ns_slider02.document.close()
thelength=document.ns_slider01.document.ns_slider0 2.document.width
scrollslide()
}

//NS specific function for scrolling the images
function scrollslide()
{
if (document.ns_slider01.document.ns_slider02.left>=t helength*(-1))
{
document.ns_slider01.document.ns_slider02.left-=vitessevisio
setTimeout("scrollslide()",100)
}
else
{
document.ns_slider01.document.ns_slider02.left=lar gvisio
scrollslide()
}
}

//window.onload=regenere_visio2

//--> Fin Script 2
</script>
</td>
<td width="32" valign="top"><img src="tmp/triangle2.gif" width="14" height="54" align="top" onMouseOver="scrolldir()" onMouseOut="scrollplay()"></td>
</tr>
</table>
</body>
</html>

PD: Como le acabo de ver y ya me acostaba, mañana le pego una pasada y te miro el resto.

Saludos y Felices fiestas!
  #3 (permalink)  
Antiguo 30/12/2002, 15:13
Avatar de medinauta  
Fecha de Ingreso: diciembre-2002
Ubicación: Guayaquil
Mensajes: 159
Antigüedad: 21 años, 4 meses
Puntos: 0
Hola, Chivi, graias por responder, te cuento que lo que quería era mantener el comportamiento "slide", lo que pasa es esto:

Inicio la marquesina con el comportamiento "slide", esto hace que se detenga al fializar la serie de imágenes (algunas se ocultarán en la izquierda).

Después los controles son para hacer correr la marquesina hacia donde desee (x ejemplo, hacia la derecha, para que se muestren las que quedaron ocultas a la izquierda).

En este script, consigo que "retroceda", cambiándole el comportamiento de "slide" a "scroll"cuando hago onMouseOver sobre uno de los controles y ahí hago lo que deseo, que es hacer retroceder la marquesina, de ahí la marquesina debería quedarse en standby, PERO, lo que pasa es que continúa porque tiene el comportamiento de "scroll", en el script está un onMouseOut para que cambie de nuevo a "slide", pero ahí es el problema, no lo cambia desde ahí sino que inicia la marquesina desde cero, en lugar de solo cambiar el comportamiento.

Bueno esto me está dando mucho problema, me parecía un efecto chévere.

Gracias por cualquier ayuda....
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:46.