Foros del Web » Creando para Internet » HTML »

Tooltip en un Select?

Estas en el tema de Tooltip en un Select? en el foro de HTML en Foros del Web. Necesito hacer algo de ese estilo, el tema es que tengo un select desplegable al que mediante Css le asigno un ancho fijo, dentro de ...
  #1 (permalink)  
Antiguo 09/01/2007, 07:39
 
Fecha de Ingreso: julio-2002
Ubicación: Valparaiso
Mensajes: 152
Antigüedad: 15 años, 4 meses
Puntos: 0
Pregunta Tooltip en un Select?

Necesito hacer algo de ese estilo, el tema es que tengo un select desplegable al que mediante Css le asigno un ancho fijo, dentro de cada <option> </option> despliego ciertos valores los cuales al ser tantos no alcanzo a ver el texto completo, por un tema de diseño no puedo ensancharlo mas, me gustaria saber de k manera podria ponerse algo asi como un tooltip que al posicionarme en alguna de las opciones mostrara la descripcion completa de la opcion.
  #2 (permalink)  
Antiguo 09/01/2007, 22:32
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Re: Tooltip en un Select?

Mmm, creo que un diseño debe estar supeditado a la función. No se de un Tooltip, pero creo que o acortas el texto o agrandas la caja.

Con JavaScript puedes tener cajas adicionales de descripción.

Por acá hay algo todavía por depurar:
Código PHP:
<!-- Men&#250; "Drop Down" con descripción-->
<script type="text/javascript" language="JavaScript1.1">

desc = new Array(6); 
    
desc[0] = "";
    
desc[1] = "Primera Descripción";
    
desc[2] = "Segunda Descripción";       
    
desc[3] = "Tercera Descripción";
    
desc[4] = "Cuarta Descripción";
    
desc[5] = "Quinta Descripción";
function 
describir() {
    
descripcion document.Forma.Opcion.selectedIndex
    document
.Forma.AreaD.value desc[descripcion];
    }
function 
ir() {
    
document.location document.Forma.Opcion.options[document.Forma.Opcion.selectedIndex].value
    
}
// --></script>

<form name="Forma">

<
select name="Opcion" size="5" OnChange="describir()">
<
option value="#">Seleccione una opci&#243;n:
<option value="00-01-Subtema.htm">T&#237;tuloSubtema01a
<option value="00-02-Subtema.htm">T&#237;tuloSubtema01b
<option value="00-03-Subtema.htm">T&#237;tuloSubtema01c
<option value="00-04-Subtema.htm">T&#237;tuloSubtema01d
<option value="00-05-Subtema.htm">T&#237;tuloSubtema01e
</select>

<
br />

<
textarea name="AreaD" rows="5" cols="50"readonly="readonly">
Aqu&#237; puedes leer la descripción de las opciones del menú.
</textarea>
<
br />
<
input type="button" value=" Aceptar " onclick="ir()">
</
form
  #3 (permalink)  
Antiguo 10/01/2007, 07:22
 
Fecha de Ingreso: julio-2002
Ubicación: Valparaiso
Mensajes: 152
Antigüedad: 15 años, 4 meses
Puntos: 0
Re: Tooltip en un Select?

Hola Rafael.. Gracias por tu respuesta...
La verdad es que encontre algo que muestra una especie de tooltip con la lista de opciones del Combo (Select), el tema es que el tooltip aparece justo a la derecha donde termina el combo (Select), o sea imaginate si era el ancho del combo lo que me complicaba, el tooltip es casi igual de ancho y al final se me pierde de la pagina...
Estoy modificando para que aparezca en otro sector de la pagina.. Cuando lo temine lo pongo por si le sirve a alguien
  #4 (permalink)  
Antiguo 10/01/2007, 09:14
Avatar de jeanclon  
Fecha de Ingreso: mayo-2005
Mensajes: 258
Antigüedad: 12 años, 6 meses
Puntos: 2
Re: Tooltip en un Select?

Pero si quieres publica el codigo que tienes para ver si alguien puede realizar alguna modificacion.
  #5 (permalink)  
Antiguo 10/01/2007, 19:28
Avatar de Rafael
Modegráfico
 
Fecha de Ingreso: marzo-2003
Mensajes: 8.954
Antigüedad: 14 años, 9 meses
Puntos: 1802
Re: Tooltip en un Select?

Esperamos a verlo :)
  #6 (permalink)  
Antiguo 12/01/2007, 05:46
 
Fecha de Ingreso: julio-2002
Ubicación: Valparaiso
Mensajes: 152
Antigüedad: 15 años, 4 meses
Puntos: 0
Re: Tooltip en un Select?

Ok.. esto fue lo que encontre, pero lo deje ahi mientras, ya que tenia otros temas que terminar, pero aqui va algo como lo k necesito.-

<html>
<head>
<title> SELECT's.</title>
<script language="javascript">

function Descrip(){
document.getElementById('dscr').style.display = 'none'}

</script>
</head>
<body>

<form name=frm>

<span onmouseout="setTimeout('Descrip()',10000)"
style="font:12px sans-serif; position:absolute; width:65px">
<select style="font:12px sans-serif; width:40px"
onmousedown="document.getElementById('dscr').style .display=
'inline'" onchange="Descrip()" onblur="Descrip()">
<option>1</option>
<option>2</option>
<option>3</option>
<option>4</option>
<option>5</option>
</select><span id=dscr style="display:none; padding:0 5px;
margin-left:40px; float:right; background:infobackground;
border:1px solid infotext"> Primero<br>Segundo<br>Tercero<br>Cuarto<br>Quinto
</span></span>

</form>
</body>
</html
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 08:42.