Foros del Web » Creando para Internet » HTML »

lista desplegable con multiple respuesta

Estas en el tema de lista desplegable con multiple respuesta en el foro de HTML en Foros del Web. necesito una ayuda con una lista deplegable que me tire varios checkbox, tengo una pero no me funciona si la agrego varias veces en el ...
  #1 (permalink)  
Antiguo 25/08/2011, 00:37
 
Fecha de Ingreso: agosto-2011
Mensajes: 1
Antigüedad: 5 años, 3 meses
Puntos: 0
lista desplegable con multiple respuesta

necesito una ayuda con una lista deplegable que me tire varios checkbox, tengo una pero no me funciona si la agrego varias veces en el mismo html, el codigo es el siguiente.


<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>test</title>
<style>
*{ margin:0px; padding:0px; outline:none;}
#lista{ width:200px;; margin: 50px;font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; visibility:hidden}
#lista dt{ border: 1px solid #000; background-color:#666; color:#FFF; padding-left:3px; margin-top:3px; line-height:16px}
#lista dd{ padding:3px; border-bottom:1px solid #000;border-left:1px solid #000; border-right:1px solid #000; overflow:hidden}
body{font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px;}
#flecha{border-bottom:0; border-right:6px solid #666; border-top:7px solid #FFF; border-left:6px solid #666; width:0; height:0; position:relative; left:175px; top:-10px}
</style>

<script>
var EvRegister=[];
var panino=(function(){
/* ---- métodos privados ---- */
var metodosPrivados={
addEvent: function(type, fn ) {
if ( this.addEventListener ) {
this.addEventListener( type, fn, false );
} else if(this.attachEvent){
var _this=this;
var f= function(){fn.call(_this,window.event);}
this.attachEvent( 'on'+type, f);
this[fn.toString()+type]=f;
}else{
this['on'+type]=fn;
}
var ev={_obj:this,_evType:type,_fn:fn};
window.EvRegister.push(ev);
return this;
},
removeEvent: function(type, fn ) {
if( this.removeEventListener){
this.removeEventListener( type, fn, false );
}
else if(this.detachEvent){
this.detachEvent('on'+type,this[fn.toString()+type]);
this[fn.toString()+type]=null;
}
else{
this['on'+type]=function(){};
}
for (var ii= 0, l=window.EvRegister.length; ii < l ; ii++) {
if (window.EvRegister[ii]._evType== type && window.EvRegister[ii]._obj==this && window.EvRegister[ii]._fn==fn) {
window.EvRegister.splice(ii, 1);
break;

}
}
return this;
},
css:function(propiedad,valor){
if(!valor)
return this.style[propiedad];
this.style[propiedad]=valor;
return this;
},
hover:function(a,b){
this.addEvent('mouseover', a );
this.addEvent('mouseout', b );
return this;
},
alfa:function(value){
this.style.opacity = value;
this.style.MozOpacity = value;
this.style.KhtmlOpacity = value;
this.style.filter = 'alpha(opacity=' + value*100 + ')';
this.style.zoom=1;
return this;
},
toggle:function(a,b){
this.style.display=this.style.display=='none'?'blo ck':'none';
if(!!a && !!b)
a.parentNode.replaceChild(b,a);
return this;
},
extendido:true

}
/* ---- métodos públicos ---- */
return{
extend:function(el,obj){
if(el.extendido && el!=metodosPrivados)return el;
for(var i in obj)
el[i]=obj[i];
return el;
},
get:function(id){
if(!document.getElementById(id))return false;
return panino.extend(document.getElementById(id),metodosP rivados);
},
getO:function(obj){
return panino.extend(obj,metodosPrivados);
},
add:function(obj){
panino.extend(metodosPrivados,obj);
}
}
})();
function unregisterAllEvents() {
while (EvRegister.length > 0) {
panino.getO(EvRegister[0]._obj).removeEvent(EvRegister[0]._evType,EvRegister[0]._fn);
}
}
var $=panino.get;
panino.getO(window).addEvent('unload',unregisterAl lEvents);

function Acordeon(id,abierto){
this.abierto=abierto || 0;
this.id=id;
this.init=function(){
var _this=this;
for(var i=0,els; els=$(this.id).getElementsByTagName('dt')[i];i++){
var maxExpand=$(this.id).getElementsByTagName('dd')[i].offsetHeight;
if(!this.abierto || this.abierto!=i+1){
$(this.id).getElementsByTagName('dd')[i].style.height=0;
$(this.id).getElementsByTagName('dd')[i].style.display='none';
$(this.id).getElementsByTagName('dd')[i].creciendo=1;
}else{
$(this.id).getElementsByTagName('dd')[i].creciendo=0;
$(this.id).getElementsByTagName('dd')[i].style.height=maxExpand+'px';
}

(function(){
var _maxExpand=maxExpand;
var numero=i;
panino.getO(els).addEvent('click',function(){_this .efectuar(_maxExpand,numero);}).css('cursor','poin ter');
panino.getO(window).addEvent('unload',function(){$ (_this.id).getElementsByTagName('dd')[numero].t=null;$(_this.id).getElementsByTagName('dd')[numero].creciendo=null;});
})()
}
$(this.id).css('visibility','visible');
}
this.efectuar=function(maximo,elemento){
var _this=this;
if($(_this.id).getElementsByTagName('dd')[elemento].t!=null && typeof $(_this.id).getElementsByTagName('dd')[elemento].t!='undefined' && $(_this.id).getElementsByTagName('dd')[elemento].t.done_!=true)return;
var inicio=parseInt($(this.id).getElementsByTagName('d d')[elemento].style.height);
var fin= $(_this.id).getElementsByTagName('dd')[elemento].creciendo ? maximo : 0;
$(_this.id).getElementsByTagName('dd')[elemento].creciendo=!$(_this.id).getElementsByTagName('dd')[elemento].creciendo;
$(_this.id).getElementsByTagName('dd')[elemento].t=new Transition(SineCurve, 500, function(percentage) {
if(fin<inicio){
var delta=inicio-fin;
$(_this.id).getElementsByTagName('dd')[elemento].style.height=(inicio-(percentage*delta))+'px';
}
else{
var delta=fin-inicio;
$(_this.id).getElementsByTagName('dd')[elemento].style.height=(inicio+(percentage*delta))+'px';
}
if(parseInt($(_this.id).getElementsByTagName('dd')[elemento].style.height)<1)
$(_this.id).getElementsByTagName('dd')[elemento].style.display='none';
else
$(_this.id).getElementsByTagName('dd')[elemento].style.display='block';
});
$(_this.id).getElementsByTagName('dd')[elemento].t.run();
}

}
function Transition(curve, milliseconds, callback) {
this.done_=false;
this.curve_ = curve;
this.milliseconds_ = milliseconds;
this.callback_ = callback;
this.start_ = new Date().getTime();
this.run=function() {
var _this=this;
if(!this.hasNext()) {
window['globalIntervalo']=0;
return;
}
this.callback_(this.next());
setTimeout(function(){_this.run.call(_this);}, 0);
}
this.hasNext=function() {
if(this.done_)
return false;
var now = new Date().getTime();
if ((now - this.start_) > this.milliseconds_) {
this.done_ = true;
}
return true;
}
this.next=function() {
var now = new Date().getTime();
var percentage = Math.min(1, (now - this.start_) / this.milliseconds_);
return this.curve_(percentage);
}
}

function SineCurve(percentage) {
return (1 - Math.cos(percentage * Math.PI)) / 2;
}
onload=function(){
var t=new Acordeon('lista');
t.init();
}
</script>
</head>

<body>

<form id="form1" name="form1" method="post" action="">
<dl id="lista">
<dt>seleccionar<div id="flecha"></div></dt>
<dd>
<input name="" type="checkbox" value="" /> uno<br />

<input name="" type="checkbox" value="" /> dos<br />

<input name="" type="checkbox" value="" /> tres<br />

<input name="" type="checkbox" value="" /> cuatro
</dd>
</dl>

</form>
</body>
</html>
  #2 (permalink)  
Antiguo 25/08/2011, 08:57
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 8 años, 5 meses
Puntos: 1008
Respuesta: lista desplegable con multiple respuesta

ese es un problema de javascript. hoy nadie postea en foro adecuado

pd: usa las etiquetas para envolver código

Etiquetas: css, desplegable, lista, respuesta, formulario
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 20:12.