Autor Tema: dudas con java script  (Leído 11126 veces)

0 Usuarios y 1 Visitante están viendo este tema.

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
dudas con java script
« : octubre 04, 2006, 02:49:13 pm »
Pues... ahroa en la mañana hice un script de que... cambiara la imagen cuando el mouse esta encima... la cosa que me funciono y todo pero.. cuando lo correo en firefox no me funciono ¬¬

como puedo hacer para que me funcione en firefox tambien?
la verdad no entiendo cual sera la diferencia en un java script que funcione en los dos navegadores  :huh: no sera que el puedoa gregar alguna linea de codigo?

estoy medio enchibolada con eso :hammer:

me ayudan?

Desconectado Ra!

  • The Communiter-
  • *
  • Mensajes: 1025
Re: dudas con java script
« Respuesta #1 : octubre 04, 2006, 03:05:36 pm »
hola mira xq no intentas hacer las animaciones con el SWITSH MAX?
"Solo una cosa vuelve un sueño imposible, el miedo a fracasar"

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
Re: dudas con java script
« Respuesta #2 : octubre 04, 2006, 03:07:49 pm »
por que.. si hago demasiado flash.. el sitio sera bn pesadote...

aunque el flahs que tiene lo trabaja con xml...

bueno.. la verdad tenia la idea que que seria algo mas facil con un script

Desconectado mxgxw

  • Global Moderator
  • The Communiter-
  • *
  • Mensajes: 5665
  • Starlet - 999cc
    • mxgxw
Re: dudas con java script
« Respuesta #3 : octubre 04, 2006, 03:35:26 pm »
hola mira xq no intentas hacer las animaciones con el SWITSH MAX?

Fuck flash!!! fdslkhflkjhflkjafdsa CSS+HTML+JAVASCRIPT, AJAX es el futuro... mirate www.messengerfx.com no vas a encontrar ningun flash y la funcionalidad es bastante impresionante.... el problema es que nadie dijo que iba a ser mas sencillo...

Para tu problema te puede servir este script:
Código: [Seleccionar]
<script languajge="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original:  Dan Christensen -->
<!-- Begin
  var aryImages = new Array(2);

  aryImages[0] = "imgNormal.GIF"; // imagen normal
  aryImages[1] = "imgOver.GIF"; // imagen sobre el vinculo

  // Precarga de las imagens
  for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages[i];
  }

  // Funcion de cambio de imagen
  function swap(imgIndex) {
    document['imagen'].src = aryImages[imgIndex];
  }
//  End -->
</script>

La página completa te quedaria algo asi:

Código: [Seleccionar]
<body>
<head>
<title>ImgOver test</title>

<script languajge="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original:  Dan Christensen -->
<!-- Begin
  var aryImages = new Array(2);

  aryImages[0] = "imgNormal.GIF";
  aryImages[1] = "imgOver.GIF";

  for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages[i];
  }

  function swap(imgIndex) {
    // 'imagen' es el nombre de la imagen que deseamos cambiar
    document['imagen'].src = aryImages[imgIndex];
  }
//  End -->
</script>

<body>
<a href="#" onmouseover="swap(1)" onmouseout="swap(0)">
<img name="imagen" id="imagen" src="imgNormal.GIF"></a>
</body>
</html>

Con eso te deberia de funcionar en cualquier navegador. te dejo el zip con el ejemplo.


Desconectado Ra!

  • The Communiter-
  • *
  • Mensajes: 1025
Re: dudas con java script
« Respuesta #4 : octubre 04, 2006, 03:38:12 pm »
jeje lo mio solo fue una sugerencia :p no se enojen ok :p
"Solo una cosa vuelve un sueño imposible, el miedo a fracasar"

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
Re: dudas con java script
« Respuesta #5 : octubre 04, 2006, 03:43:47 pm »
gracias mxgxw!

pero.. digamos.. uso ese script son 6 botones los que encesito que hagan mouseover... entonces.. hago 6 funciones distintas... ?

que largo se oye hacer eso para 6 imagenes x_x x_x

Desconectado mxgxw

  • Global Moderator
  • The Communiter-
  • *
  • Mensajes: 5665
  • Starlet - 999cc
    • mxgxw
Re: dudas con java script
« Respuesta #6 : octubre 04, 2006, 03:53:25 pm »
gracias mxgxw!

pero.. digamos.. uso ese script son 6 botones los que encesito que hagan mouseover... entonces.. hago 6 funciones distintas... ?

que largo se oye hacer eso para 6 imagenes x_x x_x


Podrias modificar el script así:

Código: [Seleccionar]
<script languajge="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original:  Dan Christensen -->
<!-- Begin
  var aryImages = new Array(2);

  // Aqui agregas todas las imagenes que vas a precargar
  // Lo unico que interesa aqui, es que tengan el mismo nombre
  // con el que las vas a llamar
  // si tenes seis botones, serian doce imagenes asi:
  aryImages[0] = "imgNormal.GIF";
  aryImages[1] = "imgOver.GIF";
  aryImages[2] = "imgOver.GIF";
  aryImages[3] = "imgOver.GIF";
  aryImages[4] = "imgOver.GIF";
  aryImages[5] = "imgOver.GIF";
  aryImages[6] = "imgOver.GIF";
  aryImages[7] = "imgOver.GIF";
  aryImages[8] = "imgOver.GIF";
  aryImages[9] = "imgOver.GIF";
  aryImages[10] = "imgOver.GIF";
  aryImages[11] = "imgOver.GIF";

  // Precarga de las imagens
  for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages[i];
  }

  // Funcion de cambio de imagen
  function swap(imagen,src) {
    document[imagen].src = src;
  }
//  End -->
</script>

En el codigo html la diferencia es que para llamar a swap('nombreImagen','imagennueva'), solo tenes que ir poniendo el nombre de cada imagen, así:

Código: [Seleccionar]
<body>
<head>
<title>ImgOver test</title>

<script languajge="JavaScript">

<!-- This script and many more are available free online at -->
<!-- The JavaScript Source!! http://javascript.internet.com -->
<!-- Original:  Dan Christensen -->
<!-- Begin
  var aryImages = new Array(2);

  // Aqui agregas todas las imagenes que vas a precargar
  // Lo unico que interesa aqui, es que tengan el mismo nombre
  // con el que las vas a llamar
  // si tenes seis botones, serian doce imagenes asi:
  aryImages[0] = "imgNormal.GIF";
  aryImages[1] = "imgOver.GIF";
  aryImages[2] = "imgOver.GIF";
  aryImages[3] = "imgOver.GIF";
  aryImages[4] = "imgOver.GIF";
  aryImages[5] = "imgOver.GIF";
  aryImages[6] = "imgOver.GIF";
  aryImages[7] = "imgOver.GIF";
  aryImages[8] = "imgOver.GIF";
  aryImages[9] = "imgOver.GIF";
  aryImages[10] = "imgOver.GIF";
  aryImages[11] = "imgOver.GIF";

  // Precarga de las imagens
  for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages[i];
  }

  // Funcion de cambio de imagen
  function swap(imagen,src) {
    document[imagen].src = src;
  }
//  End -->
</script>

<style>
<!--
.swapImage {
   border: 0;
   cursor: default;
}
//-->
</style>
<body>
<a href="#" onmouseover="swap('imagen','imgOver.GIF')" onmouseout="swap('imagen','imgNormal.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="imgNormal.GIF"></a>

<a href="#" onmouseover="swap('imagen2','imgNormal.GIF')" onmouseout="swap('imagen2','imgOver.GIF')">
<img class="swapImage" name="imagen2" id="imagen2" src="imgOver.GIF"></a>
</body>
</html>


Con el estilo css que agregue evita que te le aparesca el borde a la imagen, y tambien evita que se ponga el cursor en forma de manita.

Podes quitar lo de la precarga, pero si la conexion del usuario es lenta entonces se va a ver feo.
« Última Modificación: octubre 04, 2006, 03:55:44 pm por mxgxw »


Desconectado kikeuntercio

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1545
  • -] java Adict [-
    • Comunidad Bitcoin de Oriente
Re: dudas con java script
« Respuesta #7 : octubre 04, 2006, 04:01:43 pm »
bueno aca esta super sencillo pos no mucho en html pero espero te sirva.

con script:
<script>
function cambiarimagen(){
imagen1.src="segunda.jpg";
}
</script>
<body>
<IMG name="imagen1" SRC="primera.jpg") onmouseover="cambiarimagen();">

sin script, a puro html:
<IMG SRC="primera.jpg" onmouseover='this.src="segunda.jpg"';>

pd. lo prove en firefox.

pd. para kordero, asi se orina parando el chorro como dice mi abuelita. :haha:


pd. se me olvido lo de la precarga.  :sorry:
« Última Modificación: octubre 04, 2006, 04:03:33 pm por kikeuntercio »
Miembro y co-fundador original de VampireTeam
Bitcoiner
CopyMaster en Finandy.com como: WillockSV

Desconectado mxgxw

  • Global Moderator
  • The Communiter-
  • *
  • Mensajes: 5665
  • Starlet - 999cc
    • mxgxw
Re: dudas con java script
« Respuesta #8 : octubre 04, 2006, 04:08:12 pm »
bueno aca esta super sencillo pos no mucho en html pero espero te sirva.

con script:
<script>
function cambiarimagen(){
imagen1.src="segunda.jpg";
}
</script>
<body>
<IMG name="imagen1" SRC="primera.jpg") onmouseover="cambiarimagen();">

sin script, a puro html:
<IMG SRC="primera.jpg" onmouseover='this.src="segunda.jpg"';>

pd. lo prove en firefox.

pd. para kordero, asi se orina parando el chorro como dice mi abuelita. :haha:


pd. se me olvido lo de la precarga.  :sorry:

Fijate que el onmouseover no funciona en todos los navegadores para la etiqueta IMG, por eso meti las imagenes dentro de un <a>< /a>
« Última Modificación: octubre 04, 2006, 04:10:32 pm por mxgxw »


Desconectado kikeuntercio

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1545
  • -] java Adict [-
    • Comunidad Bitcoin de Oriente
Re: dudas con java script
« Respuesta #9 : octubre 04, 2006, 04:11:38 pm »
Fijate que el onmouseover no funciona en todos los navegadores para la etiqueta IMG, por eso meti las imagenes dentro de un <a></a>

es probable, pero yo lo prove en firefos, en opera y en el explorer.
que son los que yo uso y me urulo bien.  :thumbsup:
Miembro y co-fundador original de VampireTeam
Bitcoiner
CopyMaster en Finandy.com como: WillockSV

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
Re: dudas con java script
« Respuesta #10 : octubre 04, 2006, 04:17:52 pm »
Citar
<body>
<head>
<title>ImgOver test</title>

<script languajge="JavaScript">
  var aryImages = new Array(2);

  // Aqui agregas todas las imagenes que vas a precargar
  // Lo unico que interesa aqui, es que tengan el mismo nombre
  // con el que las vas a llamar
  // si tenes seis botones, serian doce imagenes asi:
  aryImages[0] = "home1.gif";
  aryImages[1] = "home2.gif";
  aryImages[2] = "foro1.gif";
  aryImages[3] = "foros2.gif";
  aryImages[4] = "miembros1.gif";
  aryImages[5] = "miembros2.gif";
  aryImages[6] = "chat1.gif";
  aryImages[7] = "chat2.gif";
  aryImages[8] = "galeria1.gif";
  aryImages[9] = "galeria2.gif";
  aryImages[10] = "buscar1.gif   ";
  aryImages[11] = "buscar2.gif";

  // Precarga de las imagens
  for (i=0; i < aryImages.length; i++) {
    var preload = new Image();
    preload.src = aryImages;
  }

  // Funcion de cambio de imagen
  function swap(imagen,src) {
    document[imagen].src = src;
  }
//  End -->
</script>

<style>
<!--
.swapImage {
   border: 0;
   cursor: default;
}
//-->
</style>
<body>
<a href="#" onmouseover="swap('imagen2','imgNormal.GIF')" onmouseout="swap('imagen2','imgOver.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="home1.gif">[/url]


<a href="#" onmouseover="swap('imagen2','imgNormal.GIF')" onmouseout="swap('imagen2','imgOver.GIF')">
<img class="swapImage" name="imagen2" id="imagen2" src="foro1.gif">[/url]


<a href="#" onmouseover="swap('imagen','imgOver.GIF')" onmouseout="swap('imagen','imgNormal.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="miembros1.gif">[/url]


<a href="#" onmouseover="swap('imagen','imgOver.GIF')" onmouseout="swap('imagen','imgNormal.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="chat1.gif">[/url]


<a href="#" onmouseover="swap('imagen','imgOver.GIF')" onmouseout="swap('imagen','imgNormal.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="galeria1.gif">[/url]


<a href="#" onmouseover="swap('imagen','imgOver.GIF')" onmouseout="swap('imagen','imgNormal.GIF')">
<img class="swapImage" name="imagen" id="imagen" src="buscar1.gif">[/url]</body>

</html>

ahi esta mas o menos... pero.. au no se como van los nombres qui <a onmouseover="swap('imagen2','imgNormal.GIF')" onmouseout="swap('imagen2','imgOver.GIF')"> y por ejemplo esta dice image2 y las demas no tienen numero... les pongo numero?
« Última Modificación: octubre 04, 2006, 04:24:55 pm por mxgxw »

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
Re: dudas con java script
« Respuesta #11 : octubre 04, 2006, 04:21:00 pm »
kikeuntercio la que me paaste se aprece bastante a la que yo tenia y no me funciono...no se por que...

esta tenia antes...

<SCRIPT>
function cambiar6 () {
    document.images["home"].src = "home2.gif";
}
function volver6 () {
     home.src = "home1.gif";
}
</SCRIPT>

</HEAD>
<BODY>
<A HREF="#" onMouseOver="cambiar6();" onMouseOut="volver6();" border="0">
<IMG src="home1.gif" NAME="home"></A> <BR><BR><BR>

Desconectado mxgxw

  • Global Moderator
  • The Communiter-
  • *
  • Mensajes: 5665
  • Starlet - 999cc
    • mxgxw
Re: dudas con java script
« Respuesta #12 : octubre 04, 2006, 04:25:44 pm »
Ok mira, esque la funcion trabaja algo así... olvidemonos del preload por ahorita.

la funcion es de esta forma:

swap(nombreImagen,archivo)

Cada imagen tiene que tener un nombre diferente, el nombre se estable con el atributo name e id:

<img name="nombreImagen" id="nombreImagen" src="archivoPordefectoImagen">

si tenes varias imagenes y queres aplicarles el swap, vas a tener que ponerles nombres diferentes

<img name="imagen1" id="imagen1" ...>
<img name="imagen2" id="imagen2" ...>
<img name="imagen3" id="imagen3" ...>
<img name="imagen3" id="imagen3" ...>

Para la funcion swap igual..

Para <img name="imagen1" ....>

onmouseover="swap('imagen1','imagen1Over')"
onmouseout="swap('imagen1','imagen1Over')"

para <img name="imagen2" ...>
onmouseover="swap('imagen2','imagen2Over')"
onmouseout="swap('imagen2','imagen2Over')"

Y así sucesivamente <img name="imagenN" ...>
onmouseover="swap('imagenN','imagenNOver')"
onmouseout="swap('imagenN','imagenNOver')"

P.D.: Otra vez te modifique el post sin querer hahaha esque en otro foro ese botoncito es para darle "quote" y siempre lo apreto queriendo responder hahahaha
« Última Modificación: octubre 04, 2006, 04:28:54 pm por mxgxw »


Desconectado kikeuntercio

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1545
  • -] java Adict [-
    • Comunidad Bitcoin de Oriente
Re: dudas con java script
« Respuesta #13 : octubre 04, 2006, 04:31:31 pm »
Citar
<SCRIPT>
function cambiar6 () {
    document.images["home"].src = "home2.gif";
}
function volver6 () {
     home.src = "home1.gif";
}
</SCRIPT>

</HEAD>
<BODY>
<A HREF="#" onMouseOver="cambiar6();" onMouseOut="volver6();" border="0">
<IMG src="home1.gif" NAME="home">[/url]
creo que deberia ser asi:
Citar
<SCRIPT>
function cambiar6 () {
    document.images.home.src = "home2.gif";
}
function volver6 () {
     home.src = "home1.gif";
}
</SCRIPT>

</HEAD>
<BODY>
<A HREF="#" onMouseOver="cambiar6();" onMouseOut="volver6();" border="0">
<IMG src="home1.gif" NAME="home">[/url]
Miembro y co-fundador original de VampireTeam
Bitcoiner
CopyMaster en Finandy.com como: WillockSV

Desconectado darkela

  • Sv Vampire Team ®
  • The Communiter-
  • ***
  • Mensajes: 1619
  • 다르켈라
Re: dudas con java script
« Respuesta #14 : octubre 04, 2006, 04:34:45 pm »
:sur: :sur: :sur: ya me salio.. ahora lo provare en la pagina...