Foros del Web » Creando para Internet » CSS »

Botones que se queden apretados

Estas en el tema de Botones que se queden apretados en el foro de CSS en Foros del Web. Hola a todos, quiero hacer un menu sencillo. por ejemplo. Inicio: Portada: Nose Hola Lo que necesito con Css que cuando paso el maus se ...
  #1 (permalink)  
Antiguo 28/03/2011, 00:46
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Botones que se queden apretados

Hola a todos, quiero hacer un menu sencillo. por ejemplo.


Inicio:
Portada:
Nose
Hola

Lo que necesito con Css que cuando paso el maus se subrayen, y cuando hago click sobre ese boton, que se quede en negrita,
Actualmente lo hago con 3 dibujos por cada boton y un monton de codigo JavaScript.
Existe alguna manera?.
Saludos y muchas gracias
Fede

Última edición por fedefrankk; 28/03/2011 a las 00:47 Razón: Corrección de error ortográfico
  #2 (permalink)  
Antiguo 28/03/2011, 00:53
Avatar de Naahuel  
Fecha de Ingreso: marzo-2011
Ubicación: localhost
Mensajes: 796
Antigüedad: 6 años, 8 meses
Puntos: 192
Respuesta: Botones que se queden apretados

Ya te he respondido una pregunta prácticamente idéntica:
http://www.forosdelweb.com/f53/no-funciona-active-895695/
__________________
nahueljose.com.ar
  #3 (permalink)  
Antiguo 28/03/2011, 01:08
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Hola, si y lo he utilizado, anda de 10, y te super agradexco por el codigo de ejemplo que dejaste.

Lo que no se hacer, es hacerlo con puro texto y no con imagen en una parte de tu codigo pones :

Código CSS:
Ver original
  1. background: url('http://www.freeimagehosting.net/uploads/c3f1b24bbb.jpg') to

Como puedo hacerlo sin imagenes?..
Gracias por tu Interes.!
Saludos
Fede
  #4 (permalink)  
Antiguo 28/03/2011, 01:20
Avatar de caricatos
Moderador
 
Fecha de Ingreso: abril-2002
Ubicación: Torremolinos (Málaga)
Mensajes: 19.544
Antigüedad: 15 años, 8 meses
Puntos: 1262
Respuesta: Botones que se queden apretados

Hola:

Lo más parecido que conozco es el borde tipo inset (outset para estado normal)

Saludos
__________________
Por favor:
No hagan preguntas de temas de foros en mensajes privados... no las respondo
  #5 (permalink)  
Antiguo 28/03/2011, 02:17
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Botones que se queden apretados

¿Que es lo que quieres? El subrayado es con text-decoration:underline y la negrita es con font-weight:bold.

Suerte
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #6 (permalink)  
Antiguo 28/03/2011, 02:26
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Hola lo que necesito no se si se puede hacer.

1 paso el maus por el texto (no dibujo), y se subraye, eso bien
2 que se ponga en negrita el texto (no dibujo), bien con active lo se gracias a "caricatos",

3 Cuando preciono un boton esté, se puede quedar precionado en negrita y subrrayado, y caundo preciono otro boton, que se salga el subrayado y negrita del anterior y se ponga en el nuevo clikeado?.

Eso sería todo, es como dejar precionado el boton y si preciono otro este se despreciona y otro queda precionado.

Le agradezco el tiempo de ustedes,

Gracias
Saludos
Fede
  #7 (permalink)  
Antiguo 28/03/2011, 11:27
 
Fecha de Ingreso: enero-2011
Ubicación: Colombia
Mensajes: 6
Antigüedad: 6 años, 11 meses
Puntos: 1
Respuesta: Botones que se queden apretados

seria algo asi

Código CSS:
Ver original
  1. /*este es para que se subrayen*/
  2. #boton:hover{
  3. text-decoration: underline;
  4. }
  5. /* este es para cuando lo apachurres xD*/
  6. #boton:active {
  7. /* aca lo que quieres que cambie el color que se yo*/
  8. }
  9. #boton:select {
  10. /* aqui cuando este seleccionado */
  11. }

espero y te sirva
  #8 (permalink)  
Antiguo 28/03/2011, 14:48
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Botones que se queden apretados

¿Estás usando AJAX? Por que si no, al cambiar de página, se carga una totalmente nueva, así que se borran los estilos "generados". Lo que deberías hacer, es crear una clase con el estilo que quieras que tenga el "botón presionado", y asignar esa clase al botón que represente al "actual".

Suerte
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #9 (permalink)  
Antiguo 28/03/2011, 15:33
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Buenas, no funcino, o algo estoy haciendo mal.. dejo codigo y se agradece los ejemplo y el tiempo tomado por ustedes.

Código CSS:
Ver original
  1. .tex2{
  2. line-height:26px;
  3. font-family:"Century Gothic", "Century Schoolbook", "Century Schoolbook SWA","Arial";
  4. font-size:14px;
  5. list-style:none;
  6. text-align:justify;
  7. position: absolute;
  8. width: 655px;
  9. height: 169px;
  10. left: 263px;
  11. top: 345px;}
  12.  
  13. .boton{text-decoration:none
  14. }
  15.    
  16. .boton:hover{
  17.     text-decoration:underline;
  18. }
  19.  
  20. .boton:active {
  21.     text-decoration:underline;
  22. }
  23. .boton:select {
  24.     font-weight:bold;
  25.     text-decoration:underline;
  26. }

codigo html

Código HTML:
Ver original
  1.  
  2.                <div class="tex2" id="nu6" > <!--FEDE NUT2 -->
  3.                 <li><span onclick="uno('u')" class="boton" id="a1">UNO</span></li>
  4.                 <li><span onclick="uno('d')"class="boton" id="a2">DOS</span></li>
  5.                 <li><span onclick="uno('t')"class="boton" id="a3">TRES</span></li>
  6.                
  7.                 </div>
  8.  
  9.  
  10.  
  11.  
  12. </body>
  13. </html>

Si alguien tiene algun aporte sera agradecido.!!

Saludos a todos
fede
  #10 (permalink)  
Antiguo 28/03/2011, 15:39
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Hola,
LO que hago es lo siguiente:

Por cada boton creo 3 imagenes, uso en css hover, la primer imagen se ve y paso el maus y muestra el hover,
cada boton esta dentro de un div.

por cada boton pongo este codigo para que el boton se quede en negrita.

Código Javascript:
Ver original
  1. function acne(ac){
  2. var bot1=document.getElementById('b1_1');
  3. var bot2=document.getElementById('b1_2');
  4. var bot3=document.getElementById('b1_3');
  5. var bot4=document.getElementById('b1_4');
  6. var bot5=document.getElementById('b1_5');
  7. var bot6=document.getElementById('b1_6');
  8. bot1.style.display='none'; // escondo el boton //
  9. bot2.style.display='none';
  10. bot3.style.display='none';
  11. bot4.style.display='block'; // muestro boton en negrita //
  12. bot5.style.display='none';
  13. bot6.style.display='none';
  14. }

Realmente es un embole... tanto codigo por boton....

Saludos
Gracias.!!!
  #11 (permalink)  
Antiguo 28/03/2011, 15:49
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Botones que se queden apretados

Podrías hacerlo en un array y manejarlo con un for, pero si, creo que es la mejor solución al problema...
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #12 (permalink)  
Antiguo 28/03/2011, 16:22
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Hola, algo de array se, lo que no se hacer, es en los div?.. ya que cada uno tiene una pocision distinta, o podra hacer un array en java..

Código Javascript:
Ver original
  1. var i
  2. for (i=0;i<=6;i++) {
  3.     document.write(i)
  4.     document.write("<br>")
  5.  
  6. function acne(ac){
  7. var bot1=document.getElementById('b1_1');
  8. var bot2=document.getElementById('b1_2');
  9. var bot3=document.getElementById('b1_3');
  10. var bot4=document.getElementById('b1_4');
  11. var bot5=document.getElementById('b1_5');
  12. var bot6=document.getElementById('b1_6');
  13. bot1.style.display='none'; // escondo el boton //
  14. }
  15. }

Como hago para poner el array en esa funcion?
Código Javascript:
Ver original
  1. var bot1=document.getElementById('b1_i');--?

saludos
Gracias
Fede
  #13 (permalink)  
Antiguo 28/03/2011, 16:31
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 9 años, 9 meses
Puntos: 142
Respuesta: Botones que se queden apretados

Prueba así:

Código:
var bot={document.getElementById('b1_1'), document.getElementById('b1_2'),
document.getElementById('b1_3'), ...};
Y ya accedes a ellos en un for con
Código:
bot[i].style.display='none';
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...
  #14 (permalink)  
Antiguo 28/03/2011, 16:45
Avatar de fedefrankk  
Fecha de Ingreso: agosto-2007
Mensajes: 783
Antigüedad: 10 años, 4 meses
Puntos: 7
Pregunta Respuesta: Botones que se queden apretados

Buenas, lo pruebo y te comento.. Muchas gracias por la info..

Se agradece.!!
Saludos
Fede

Etiquetas: botones
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 02:26.