Autor
|
Tema: [Problema]Evento sencillo javascript (Leído 9,984 veces)
|
KuraraGNU
Desconectado
Mensajes: 209
|
Buenas! Tengo un problema, en mi pagina web tengo todo para que se linkee a la hoja de codigo javascript que esta aparte, pero no me hace nada de la pagina esa, probe a hacer una funcion pero nada, basicamente lo que quiero hacer es esto: document.getElementById('link').onmouseover = this.style.borderColor = "red";
Para cambiar el color del borde del div. El link es un div y aqui esta por si preguntais el codigo donde aniado el archivo <script type="text/javascript" src="Scripts/index.js"></script>
|
|
|
En línea
|
|
|
|
Spider-Net
Desconectado
Mensajes: 1.165
Un gran poder conlleva una gran responsabilidad
|
Es porque no lo estás haciendo correctamente. No sé si es ese todo el código referente al div que quieres cambiar, pero ten en cuenta que primero dentro del archivo index.js deberías crear una función que sea la que cambie el color del borde. El evento onMouseOver deberías usarlo en el propio div, para que éste cambie de color al pasar por encima. Te digo como lo haría yo: index.js: function cambia(){ document.getElementById("prueba").style.borderColor="red"; }
Tu archivo html: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <div id="prueba" style="width: 60%; border: 1px solid #2F5CB3; background-color: #CCD2EE;padding: 10px;" onmouseover="cambia();">Prueba <br /><br /><br /></div>
Ese ejemplo funciona perfectamente, no tengo claro del todo si es lo que querías o no. Un saludo.
|
|
|
En línea
|
|
|
|
KuraraGNU
Desconectado
Mensajes: 209
|
Si gracias, es que me lio con el javascript, tambien lo hice creando una funcion pero luego la funcion no la usaba donde debia, por cierto, uso css asi que lo de style="width: 60%; border: 1px solid #2F5CB3; background-color: #CCD2EE;padding: 10px;"
me lo ahorro, no?
|
|
|
En línea
|
|
|
|
Spider-Net
Desconectado
Mensajes: 1.165
Un gran poder conlleva una gran responsabilidad
|
Claro, el CSS puedes usar el que tú quieras, yo puse el style simplemente para que al hacer la prueba se notase el cambio de color, nada más. Pero por supuesto lo puedes hacer con tus propios estilos CSS, funcionará igual.
|
|
|
En línea
|
|
|
|
Nakp
casi es
Ex-Staff
Desconectado
Mensajes: 6.336
he vuelto :)
|
no es mas facil agregar esto a la hoja de estilos? #link:hover{ border-color: red; }
|
|
|
En línea
|
Ojo por ojo, y el mundo acabará ciego.
|
|
|
Spider-Net
Desconectado
Mensajes: 1.165
Un gran poder conlleva una gran responsabilidad
|
Más fácil si que es, pero es puro CSS. Yo supongo que preguntó lo del hacerlo con javascript porque igual necesita hacerlo con javascript por cualquier motivo. Pero bueno, desde luego alternativas no faltan, también se puede puede hacer fácilmente con jQuery que tiene unos selectores de DOM más cómodos que el puro javascript. Pero bueno, ya que KuraraGNU elija la opción que más le convenga o necesite claro.
|
|
|
En línea
|
|
|
|
KuraraGNU
Desconectado
Mensajes: 209
|
Buenas, gracias, me entere despues de que se podia hacer con css, es que yo no se mucho, solo lo basico y la verdad que estoy empezando a hartarme de javascript, porque cada cosa que quiero hacer no me la hace, creo que probe a poner lo que tu pusiste y no salia, no recuerdo, acabe harta, la verdad. Ahora estoy intentando poner un link que cambie una imagen y tampoco sale nada. Si alguien sabe de un manual bueno de javascript online, porque se ve que los que tengo yo no sirven. De todas formas, por si acaso, voy a poner lo que he hecho aqui: Mi codigo HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <link rel="shortcut icon" href="../img/controlecuadrado.ico" type="image/ico" /> <link rel="stylesheet" type="text/css" href="../css/montacarichi.css" media="screen" /> <link rel="stylesheet" type="text/css" href="../css/style.css" media="screen" /> <img id="imagenGaleria2" class="borde" src="montacarichi/montacarichicopia.jpg" name="Imagen1" /> <img id="imagenGaleria" src="montacarichi/montacarichi1copia.jpg" name="Imagen2" /> <img id="imagenGaleria" src="montacarichi/montacarichi2copia.jpg" name="Imagen3" /></div> <div id="anterior"><a href="#" onclick="change();"><< </a></div> <div id="posterior" ><a href="#" onClick="change();">>></a></div>
Mi javascript: var cont = 0; function change() { if(cont==0) { document.getElementById("imagengaleria2").src = "montacarichi/montacarichi3copia.jpg"; document.imagen2.src="montacarichi/montacarichi4copia.jpg"; document.imagen3.src="montacarichi/montacarichi5copia.jpg"; cont=1; } else { imagen1.src="montacarichi/montacarichicopia.jpg"; imagen2.src="montacarichi/montacarichi1copia.jpg"; imagen3.src="montacarichi/montacarichi2copia.jpg"; cont=0; } }
Bueno, lo he puesto de varias formas a ver si el problema era la forma de acceder al elemento, pero nada. Por si acaso, os digo, el documento code.js esta en la misma carpeta que el index.html y en esa carpeta esta la carpeta llama montacarichi, asi que por problemas de link no creo que sea. P.D: He solucionado lo del click Os quiero :* :* :* :* :* :*
|
|
« Última modificación: 12 Abril 2011, 14:54 pm por KuraraGNU »
|
En línea
|
|
|
|
Spider-Net
Desconectado
Mensajes: 1.165
Un gran poder conlleva una gran responsabilidad
|
Has solucionado lo de la imagen al final?, es que no me ha quedado claro si lo solucionaste. Yo te recomiendo los libros que leí yo: Libro javascriptLibro AJAXSon gratuitos y bastante completos. Luego puedes complementar con jQuery, yo te lo recomiendo encarecidamente, porque te ahorrará mucho trabajo.
|
|
|
En línea
|
|
|
|
KuraraGNU
Desconectado
Mensajes: 209
|
ìGracias! Si, lo tengo todo solucionado Si me pasa algo lo vuelvo a escribir en este post XD que me siento ya como en casa en el. Los libros son los que yo miraba, pero no sabia que es lo que es AJAX, asi que solo me e leido el primero.
|
|
|
En línea
|
|
|
|
Spider-Net
Desconectado
Mensajes: 1.165
Un gran poder conlleva una gran responsabilidad
|
Te recomiendo echarles entonces un vistazo también al de CSS y CSS Avanzado, ya que la mayoría de efectos los puedes hacer directamente con CSS, sin necesidad de usar javascript. El de AJAX yo diría que es imprescindible, hoy en día prácticamente todas las webs importantes usan AJAX. Cualquier duda que te surja, por aquí estamos para ayudarte en lo que se pueda.
Un saludo.
|
|
|
En línea
|
|
|
|
|
Mensajes similares |
|
Asunto |
Iniciado por |
Respuestas |
Vistas |
Último mensaje |
|
|
AJAX y evento onkeyup (javascript), como detectar ?
PHP
|
Diabliyo
|
1
|
6,052
|
20 Noviembre 2010, 06:52 am
por Nakp
|
|
|
Hacer que un elemento se autoseleccione tras un evento (alerta) en javascript
Desarrollo Web
|
T0p1t0
|
7
|
4,243
|
7 Junio 2013, 13:25 pm
por T0p1t0
|
|
|
Ayuda: evento javascript
Desarrollo Web
|
Felipelf95
|
0
|
1,906
|
26 Septiembre 2016, 21:15 pm
por Felipelf95
|
|
|
[Resuelto] javascript. Código sencillo no funciona. addEventListener a botones.
Desarrollo Web
|
@XSStringManolo
|
2
|
4,550
|
29 Diciembre 2019, 22:40 pm
por @XSStringManolo
|
|
|
[javascript][DUDA] ¿Algún ejemplo sencillo de clases en javascript?
Desarrollo Web
|
.:Xx4NG3LxX:.
|
6
|
6,091
|
18 Septiembre 2020, 23:41 pm
por .:Xx4NG3LxX:.
|
|