Responder
Código para imagenes "flash"
Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#1

No se si es código HTML avanzado, pero bueno: Son unas imagenes que cuando colocas el puntero sobre las imágenes cambian, o sea que sale otra diferente(bueno para que veais a lo que me refiero, en la web www.renno-metal.com, en el menú, al pasar el puntero, las imágenes con el menú pasan de fondo negro a rojo) A ver si me podeis decir el código URL de esas imágenes qu creo que se denominan "flash-images"

Gracias

Haz clic para ver el perfil del usuario

@man / @woman
@man / @woman

#2


No es ni flash ni HTML, es JavaScript. Te vere sufrir Vacilando

Y mira que es lo mas facil que puedo explicarlo >_<




Son botones hechos con rollovers de dos estados. En un estado el botón esta normal y en el segundo estado la imagen del botón tiene el efecto de brillo y se acciona con el evento OnMouseOver.

El codigo es este, a ver si me explico:

- Paso 1 -
Entre el <head> y el </head> del sitio vas a poner la siguiente funcion Javascript:

<SCRIPT languaje="JavaScript">
function mueveimg(img_name,img_src)
{
document[img_name].src=img_src;
}
</SCRIPT>



- Paso 2 -
Cada imagen que quieras que cambie cuando pase el mouse deberas agregarle un parametro name="nombre de la imagen" donde podras ponerle un nombre cualquiera a la imagen (no necesariamente el del archivo) pero que no se repitan.



- Paso 3 -
Vas a poner como ligas los botones que es donde quieres que al pasar el mouse cambie la imagen con el siguiente formato:

<a href="#" onmouseover="mueveimg('nombre que le diste a la imagen','URL de la imagen CON el mouse encima');return true;" onmouseout= "mueveimg('nombre que le diste a la imagen','URL de la imagen SIN el mouse encima');return true;"><img name="nombre que le diste a la imagen" border="0" src="URL de la imagen SIN el mouse encima"></a>

(poco lioso )



Consideraciones:
- En la liga "nombre que le diste a la imagen" debe ser exactamente el mismo del parametro name="nombre de la imagen"

- Debes tener cuidado con las URL de las dos imagenes (con y sin mouse)




CASO PRACTICO

<!-- Funcion para traslapar las imagenes-->
<head>
<SCRIPT languaje="JavaScript">
function mueveimg(img_name,img_src)
{
document[img_name].src=img_src;
}
</SCRIPT>
</head>

<body>


<!-- Codigo de uno solo de los botones, uno por cada boton -->

<a href="#" onmouseover="mueveimg('MiImagen','MiImagenOn.gif');return true;" onmouseout= "mueveimg('MiImagen','MiImagenOff.gif');return true;"><img name="MiImagen" border="0" src="MiImagenOff.gif" width="80" height="80"></a>

</body>

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#3

Esta muy bien explicado, el problema esuqe yo soy nuevo en esto....Lo que no se es como ponerle nombre a la imagen, vamos paso 2, y mi web es una php-nuke, habia pensado poner un menú de esos en un bloque...en un nuke donde esta el head?? aunque mejor ponerlo incluido en la web, no en un bloque, como lo tiene www.rafabasa.com ...ayuda Llorando

Haz clic para ver el perfil del usuario

Machacateclados
Machacateclados

#4

Te paso a explicar como se puede lograr esos efectos en una forma simple con Dreamweaver.
En www.renno-metal.com lo q tiene es una imagen q cuando pasas el mouse encima cambia a otra imagen. Se logra en Insertar... Objetos de imagen... Imagen de sustitución. Tenes q tener las dos imágenes y las agregas en el cuadro q se te abre tambien le podes agregar una url para usarlo como link.
(Es javascript pero Dreamweaver te lo hace automáticamente)

En www.rafabasa.com usa otra función tamb se puede usar con Dreamweaver y esta en Insertar... Media... Texto Flash. Ahí pones el texto q queres q tenga y los colores y el color q aparezca cuando pases el Mouse, también con opción para linkear.
(Te crea un archivo flash pero Dreamweaver te lo hace automáticamente)

Salu2 Giño

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#5

Alejandro, la putada esque no tengo el dreamweaver, y el mes de prueba ya lo agoté, por lo que me lo tendría que comprar y ando un poco mal de perras, además es el ordenador de mi padre, donde curra, y no le puedo instalar nada, pero de todas formas muchas gracias!

Caos, ¿como le pongo a una imagen el parámetro name?

Gracias

Haz clic para ver el perfil del usuario

@man / @woman
@man / @woman

#6

llevo 5 veces que escribo la respuesta... ¡bien por Miarroba! Llorica

<img name="Nombre que quieras" src="URL de la imagen" border="0">

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#7

¿Pero cuando lo pongo?

<a href="#" onmouseover="mueveimg('nombre que le diste a la imagen','URL de la imagen CON el mouse encima');return true;" onmouseout= "mueveimg('nombre que le diste a la imagen','URL de la imagen SIN el mouse encima');return true;"><img name="nombre que le diste a la imagen" border="0" src="URL de la imagen SIN el mouse encima"></a>

Donde esta en negrita por ejemplo?, pero si solo hay que poner el URl, como se lo pogno?

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#8

Mira como ejemplo, la imagen que quiero poner con el mouse es http://www.iespana.es/silverfist/fenix_on.jpg y quiero ponerle el nombre "on"; y sin el mouse http://www.iespana.es/silverfist/fenix_off.jpg con el nombre "off" , ¿Que tendría que poner?

gracias

Haz clic para ver el perfil del usuario

@man / @woman
@man / @woman

#9


Esas que pusiste son las URL de las imagenes, o sea que quedaria:

<a href="#" onmouseover="mueveimg('Imagen01','http://www.iespana.es/silverfist/fenix_on.jpg');return true;" onmouseout= "mueveimg('Imagen01','http://www.iespana.es/silverfist/fenix_off.jpg');return true;"><img name="Imagen01" border="0" src="http://www.iespana.es/silverfist/fenix_off.jpg"></a>

Nota:

name="Imagen01" debe ser un nombre QUE NO SE REPITA, un nombre para cada imagen.

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#10

Esto no rula...

He puesto exactamente esto:

<a href="#" onmouseover="mueveimg('Imagen01','http://www.iespana.es/silverfist/fenix_on.jpg');return true;" onmouseout= "mueveimg('Imagen02','http://www.iespana.es/silverfist/fenix_off.jpg');return true;"><img name="Imagen03" border="0" src="http://www.iespana.es/silverfist/fenix_off.jpg"></a>

Y me aparece la imagen en blanco y negro ( http://www.iespana.es/silverfist/fenix_off.jpg ) y si pincho en ella me lleva a la misma página loco [ lo puedes ver en : https://silverfist.webcindario.com/modules.php?name=Content&pa=showpage&pid=1 ]

Quizá el problema esque no he añadido eso que habia que poner en el head, pero esque mi web es una php-nuke y no se si hay que ponerlo en el header de la raiz o del theme...

Siento producirte tanto quebraderos de cabeza, pero esque nunca había utilizado javascript

Gracias

Haz clic para ver el perfil del usuario

@man / @woman
@man / @woman

#11


1.- Por fuerza necesitas la función en el <head>. Revisa, hay un archivo llamado javascript.php que sirve precisamente para agregar funciones de este estilo.

2.- No te lleva a ningun lado porque en href="#" tienes que poner la dirección a donde te llevara el enlace.

Con el 2do punto me doy cuenta que no eres muy ducho en HTML, te recomiendo que leas mucho del tema o sino las cosas te seguiran pareciendo demaciado complicadas por mas explicaciones que se puedan dar.

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#12

Esque ni habia leido lo que representaba el código, solo lo que tenía que cambiar, luego lo supuse.....

Bueno todo lo que conozco de HTML lo he aprendido aquí, y con eso he hecho una web.

Muchas gracias por todo!

Haz clic para ver el perfil del usuario

Usuario habitual
Usuario habitual

#13

Más problemas...

Ahora no encuentro el <head> en javascrip.php, me aparece esto cuando la habro con textpad:

<?php

/************************************************************************/
/* PHP-NUKE: Web Portal System */
/* =========================== */
/* */
/* Copyright (c) 2002 by Francisco Burzi */
/* http://phpnuke.org */
/* */
/* This program is free software. You can redistribute it and/or modify */
/* it under the terms of the GNU General Public License as published by */
/* the Free Software Foundation; either version 2 of the License. */
/************************************************************************/

/***************************************************************************
* This file is part of the phpBB2 port to Nuke 6.0 (c) copyright 2002
* by Tom Nitzschner (tom@toms-home.com)
* http://bbtonuke.sourceforge.net (or http://www.toms-home.com)
*
* As always, make a backup before messing with anything. All code
* release by me is considered sample code only. It may be fully
* functual, but you use it at your own risk, if you break it,
* you get to fix it too. No waranty is given or implied.
*
* Please post all questions/request about this port on http://bbtonuke.sourceforge.net first,
* then on my site. All original header code and copyright messages will be maintained
* to give credit where credit is due. If you modify this, the only requirement is
* that you also maintain all original copyright messages. All my work is released
* under the GNU GENERAL PUBLIC LICENSE. Please see the README for more information.
*
***************************************************************************/

if (eregi("javascript.php",$_SERVER['PHP_SELF'])) {
Header("Location: ../index.php&quotGiño;
die();
}

##################################################
# Include for some common javascripts functions #
##################################################

if ($userpage == 1) {
echo "<SCRIPT type=\"text/javascript\">\n";
echo "<!--\n";
echo "function showimage() {\n";
echo "if (!document.images)\n";
echo "return\n";
echo "document.images.avatar.src=\n";
echo "'$nukeurl/modules/Forums/images/avatars/gallery/' + document.Register.user_avatar.options[document.Register.user_avatar.selectedIndex].value\n";
echo "}\n";
echo "//-->\n";
echo "</SCRIPT>\n\n";
}

global $module, $name;

if ($module == 1 AND file_exists("modules/$name/copyright.php&quotGiño) {
echo "<script type=\"text/javascript\">\n";
echo "<!--\n";
echo "function openwindow(){\n";
echo " window.open (\"modules/$name/copyright.php\",\"Copyright\",\"toolbar=no,location=no,directories=no,status=no,scrollbars=yes,resizable=no,copyhistory=no,width=400,height=200\&quotGiño;\n";
echo "}\n";
echo "//-->\n";
echo "</SCRIPT>\n\n";
}

?>



Alguien sabe donde se encuentra?loco

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:
Suscribir

Permisos:

TU NO PUEDES Escribir nuevos temas en este foro
TU NO PUEDES Responder a los temas en este foro
TU NO PUEDES Editar tus propios mensajes en este foro
TU NO PUEDES Borrar tus propios mensajes en este foro
Ahora son las 15:07 UTC+02:00 DST
Ir al subforo:
Temas similares
TemaUsuariosRespuestasVisitasActividad
513kMay/03
1654kApr/13
1393kJan/09