2 dudas de programación y diseño web (Tuenti)

ah otra cosa. como haríais vosotros un botón que al pasar el raton por encima se ilumine?

Comentario #1 por wicKKKED:
ah otra cosa. como haríais vosotros un botón que al pasar el raton por encima se ilumine?

me parece que lo pasar por encima se hace con ilustreitor puede ser ? x’D

Editado: o indesign

Comentario #2 por wasni:
#1 me parece que lo pasar por encima se hace con ilustreitor puede ser ? x’D

Editado: o indesign

estás claramente más verde que yo . Me refiero en el código, sé que es tener dos imágenes del mismo botón, una más clara que la otra, pero como le dices que al pasar el ratón por encima cambie

Quizá sea el color azulito de la letra, nose. Por qué no te miras el código fuente de la web del tuenti? Aunque a lo mejor es un estilo css y no se puede ver en el código fuente nuse.

Recomiendo

Comentario #3 por wicKKKED:
#2 estás claramente más verde que yo . Me refiero en el código, sé que es tener dos imágenes del mismo botón, una más clara que la otra, pero como le dices que al pasar el ratón por encima cambie

okay x’D código, recomiendo a los sabios de la web

Ya está , se llama Hover

Hover: Es el estado del enlace cuando el cursor del ratón está justo encima de él, pero sin apretar el botón aún. También lo has debido ver, pasas el ratón sobre un menú y se van coloreando o poniendo en negrita los enlaces que señalas.

Joder , me edito. Pense que querias que cambiase de color o se subrayase , no que se iluminara aunque quizá sea parecido :S

Comentario #3 por wicKKKED:
#2 estás claramente más verde que yo . Me refiero en el código, sé que es tener dos imágenes del mismo botón, una más clara que la otra, pero como le dices que al pasar el ratón por encima cambie

con un evento (javascript)

A ver. Me refiero exactamente a lo que ocurre con el botón de Entrar del login de tuenti.

Comentario #7 por bloodeR_:
#3 con un evento (javascript)

seguro que se puede hacer en html de alguna forma bastante más óptima sin tener que meter javascript

Comentario #8 por wicKKKED:
A ver. Me refiero exactamente a lo que ocurre con el botón de Entrar del login de tuenti.

#7 seguro que se puede hacer en html de alguna forma bastante más óptima sin tener que meter javascript

Aunque no sepas Javascript, hazlo con Teamviewer que te genera el código él sólo.

Creo recordar que lo del cambio de color es con javascript. La cosa es que si usas el macromedia, por ejemplo, te lo genera el solo.

En cuanto a html a secas…. creo que no habia manera, pero, me volveré a mirar apuntes

Comentario #9 por bloodeR_:
#8 Aunque no sepas Javascript, hazlo con Teamviewer que te genera el código él sólo.

teamviewer? pero eso no era un escritorio remoto? q tiene q ver con javascript, tio gracias por tu interes pero no entiendo nada de lo que dices

Comentario #11 por wicKKKED:
#9 teamviewer? pero eso no era un escritorio remoto? q tiene q ver con javascript, tio gracias por tu interes pero no entiendo nada de lo que dices

me parece que se refiere al dreamviewer, yo suelo confundirlos tambien

Editado: De todas maneras, hacerlo no tiene que ser muy complicado, seguramente no sean mas que 2-3 lineas de codigo

Con css puedes hacer todo lo que preguntas sin necesidad de JavaScript. Te recomiendo instalarte el webdeveloper, a través del cual puedes acceder a la página de estilos (css) y buscar el estilo correspondiente y notepad++ para editar archivos css y html de manera mas clara.
https://addons.mozilla.org/es-ES/firefox/addon/web-developer/

Con el típico “Ver código fuente de la página” puedes ver todo el código del botón.

<input type=”submit” id=”submit_button” class=”submit withLabels” value=”Entrar” />

Ahí tienes la clase pues sólo tienes que con Webdeveloper seleccionar en la barra CSS y Ver código css. A partir de eso es investigarlo un poco, con la propiedad hover y el background position se posiciona para elegir la region de foto que desea usar.
https://www.tuenti.com/layout/web2-Zero/images/layout/6_button.65549d98f3.png

Lo de los campos es exactamente lo mismo, hay una propiedad css para quitarle el borde al campo y simplemente le pone una imagen de fondo.
Lo de quieres una cuenta pues más de lo mismo la clase es “getAccount”, simplemente te vas al CSS y lo inspeccionas. La propiedad marcada es la que hace el efecto

.getAccount{border-top:1px solid #AD;font-size:11px;font-weight:bold;**text-shadow:0 1px

Comentario #4 por ChusGMh:
Quizá sea el color azulito de la letra, nose. Por qué no te miras el código fuente de la web del tuenti? Aunque a lo mejor es un estilo css y no se puede ver en el código fuente nuse.

Recomiendo

A7399**;text-align:right;margin-top:5px;}

Si no te aclaras con todas las etiquetas mucho, te recomiendo este libro sobre CSS muy completo para entender la mayoría del código.
https://www.librosweb.es/css/pdf/introduccion_css.pdf

Comentario #13 por Tito_Paco:
Con css puedes hacer todo lo que preguntas sin necesidad de JavaScript. Te recomiendo instalarte el webdeveloper, a través del cual puedes acceder a la página de estilos (css) y buscar el estilo correspondiente y notepad++ para editar archivos css y html de manera mas clara.
https://addons.mozilla.org/es-ES/firefox/addon/web-developer/

Con el típico “Ver código fuente de la página” puedes ver todo el código del botón.

<input type=”submit” id=”submit_button” class=”submit withLabels” value=”Entrar” />

Ahí tienes la clase pues sólo tienes que con Webdeveloper seleccionar en la barra CSS y Ver código css. A partir de eso es investigarlo un poco, con la propiedad hover y el background position se posiciona para elegir la region de foto que desea usar.
https://www.tuenti.com/layout/web2-Zero/images/layout/6_button.65549d98f3.png

Lo de los campos es exactamente lo mismo, hay una propiedad css para quitarle el borde al campo y simplemente le pone una imagen de fondo.
Lo de quieres una cuenta pues más de lo mismo la clase es “getAccount”, simplemente te vas al CSS y lo inspeccionas. La propiedad marcada es la que hace el efecto

.getAccount{border-top:1px solid #5483AD;font-size:11px;font-weight:bold;text-shadow:0 1px #4A7399;text-align:right;margin-top:5px;}

Si no te aclaras con todas las etiquetas mucho, te recomiendo este libro sobre CSS muy completo para entender la mayoría del código.
https://www.librosweb.es/css/pdf/introduccion_css.pdf

sabía yo que con css se podía hacer. Precisamente me estoy leyendo ese libro. Me lo recomendo un profesor de mi uni. Y en cuanto al tema de la pregunta inicial? sabrías como conseguir eso?

Sorry wicked, me referia al Dreamweaver

Comentario #14 por wicKKKED:
#13 sabía yo que con css se podía hacer. Precisamente me estoy leyendo ese libro. Me lo recomendo un profesor de mi uni. Y en cuanto al tema de la pregunta inicial? sabrías como conseguir eso?

Lo edité miratelo jeje, con la propiedad text-shadow

Comentario #16 por Tito_Paco:
#14 Lo edité miratelo jeje, con la propiedad text-shadow

muchas gracias, para tí la mejor respuesta.

PD: Sabes php, mysql y javascript?

Vi muy poco de php, pasar campos entre formularios y hacer una web dinámica pillando los datos de una base de datos mysql. JavaScript lo usé para validar campos de formularios, en plan que meta un nombre en vez de números etc, pero todas esas cosas las encuentras fáciles por ahí… Este año aprendí C++ y Java, mysql haciendo bases de datos y consultas etc…

Comentario #18 por Tito_Paco:
Vi muy poco de php, pasar campos entre formularios y hacer una web dinámica pillando los datos de una base de datos mysql. JavaScript lo usé para validar campos de formularios, en plan que meta un nombre en vez de números etc, pero todas esas cosas las encuentras fáciles por ahí… Este año aprendí C++ y Java, mysql haciendo bases de datos y consultas etc…

Has hecho el FP de ASI? justamente sé eso que has dicho

Comentario #19 por bloodeR_:
#18 Has hecho el FP de ASI? justamente sé eso que has dicho

En grado medio(ESI) vi lo que he puesto de php, javascript y msql. Este año en DAI(Desarrollo de Aplicaciones Informáticas) pues programación orientada a objetos. HTML y CSS en ambos ciclos.