Este es mi codigo largo:
function select_status(val){
var mul = document.getElementById("multiple");
var select= document.getElementById("stat1");
if(select.options.value=="All "){ //Para seleccionar todas las opciones
mul.value="A ,"+"B ,"+"C ,"+"CS ,"+"PS ,"+"Q ,"+"R ,"+"T ,"+"W ,"+"X ";
}else if(select.options.value=="dAll "){ //Para Borrar todas las opciones
mul.value="";
}else{
if(mul.value.indexOf(val)==-1){ //Si el valor seleccionado no existe en el input
mul.value+=(mul.value!=''?',':'')+val;
var opcion = document.getElementById(val);
opcion.style.backgroundColor = "red";
}else if(mul.value.indexOf(val)!=-1){ //Si el valor seleccionado Existe en el input (borra el valor)
if(val=="CS " || val=="PS "){ //Si el valor seleccionado es PS o CS (Borra el valor)
var valor= mul.value.indexOf(val);
var string = mul.value;
if(valor==0){ //Si el valor seleccionado esta al principio (en la posicion 0)
var sub = string.substring(0,valor+4);
mul.value=string.replace(sub,'');
}else{ //Si el valor seleccionado esta en otra posicion que no sea 0
var valor2= valor-1;
var sub = string.substring(valor2,valor+3);
mul.value=string.replace(sub,'');
}
}else{ //Si el valor seleccionado no es ni PS ni CS
var valor= mul.value.indexOf(val);
var string = mul.value;
if(valor==0){ //Si el valor seleccionado no es ni PS ni CS y esta en la posicion 0
var sub = string.substring(0,valor+3);
mul.value=string.replace(sub,'');
}else{ //Si el valos seleccionado no es ni PS ni CS y esta en cualquier posicion que no sea 0
var valor2= valor-1;
var sub = string.substring(valor2,valor+2);
mul.value=string.replace(sub,'');
}
}
var opcion = document.getElementById(val);
opcion.style.backgroundColor = "";
}
}
}
y esta es la otra parte:
var menu1=new Array()
menu1[0]='<select size="12" multiple name="stat1" id="stat1" style="background-color:#D3DEE7; font-size:0.9em; color:#334457;" onChange="select_status(this.options[this.selectedIndex].value)">'
menu1[1]='<option id="All " value="All ">Select All</option>'
menu1[2]='<option id="A " value="A ">A   -   Active Avaliable </option>'
menu1[3]='<option id="B " value="B ">B   -   Backup </option>'
menu1[4]='<option id="C " value="C ">C   -   Cancelled </option>'
menu1[5]='<option id="CS " value="CS ">CS -   Closed Sale</option>'
menu1[6]='<option id="PS " value="PS ">PS -   Pending Sale</option>'
menu1[7]='<option id="Q " value="Q ">Q   -   Terminated </option>'
menu1[8]='<option id="R " value="R ">R   -   Rented </option>'
menu1[9]='<option id="T " value="T ">T   -   Temp off Market </option>'
menu1[10]='<option id="W " value="W ">W   -   Withdrawn </option>'
menu1[11]='<option id="X " value="X ">X   -   Expired </option>'
menu1[12]='<option id="dAll " value="dAll ">Deselect All</option></select>'
var menuwidth='150' //default menu width
var menubgcolor='#D3DEE7' //menu bgcolor
var disappeardelay=250 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onclick="yes" //hide menu when user clicks within menu?
/////No further editting needed
var ie4=document.all
var ns6=document.getElementById&&!document.all
if (ie4||ns6)
document.write('<div id="dropmenudiv" style="visibility:hidden;width:'+menuwidth+';backg round-color:'+menubgcolor+'" onMouseover="clearhidemenu()" onMouseout="dynamichide(event)"></div>')
wº
function getposOffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function showhide(obj, e, visible, hidden, menuwidth){
if (ie4||ns6)
dropmenuobj.style.left=dropmenuobj.style.top="-500px"
if (menuwidth!=""){
dropmenuobj.widthobj=dropmenuobj.style
dropmenuobj.widthobj.width=menuwidth
}
if (e.type=="click" && obj.visibility==hidden || e.type=="mouseover")
obj.visibility=visible
else if (e.type=="click")
obj.visibility=hidden
}
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function clearbrowseredge(obj, whichedge){
var edgeoffset=0
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWid th-15 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var topedge=ie4 && !window.opera? iecompattest().scrollTop : window.pageYOffset
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeig ht-15 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeigh t
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure){ //move up?
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHe ight
if ((dropmenuobj.y-topedge)<dropmenuobj.contentmeasure) //up no good either?
edgeoffset=dropmenuobj.y+obj.offsetHeight-topedge
}
}
return edgeoffset
}
function populatemenu(what){
if (ie4||ns6)
dropmenuobj.innerHTML=what.join("")
}
function dropdownmenu(obj, e, menucontents, menuwidth){
if (window.event) event.cancelBubble=true
else if (e.stopPropagation) e.stopPropagation()
clearhidemenu()
dropmenuobj=document.getElementById? document.getElementById("dropmenudiv") : dropmenudiv
populatemenu(menucontents)
if (ie4||ns6){
showhide(dropmenuobj.style, e, "visible", "hidden", menuwidth)
dropmenuobj.x=getposOffset(obj, "left")
dropmenuobj.y=getposOffset(obj, "top")
dropmenuobj.style.left=dropmenuobj.x-clearbrowseredge(obj, "rightedge")+"px"
dropmenuobj.style.top=dropmenuobj.y-clearbrowseredge(obj, "bottomedge")+obj.offsetHeight+"px"
}
return clickreturnvalue()
}
function clickreturnvalue(){
if (ie4||ns6) return false
else return true
}
function contains_ns6(a, b) {
while (b.parentNode)
if ((b = b.parentNode) == a)
return true;
return false;
}
function dynamichide(e){
if (ie4&&!dropmenuobj.contains(e.toElement))
delayhidemenu()
else if (ns6&&e.currentTarget!= e.relatedTarget&& !contains_ns6(e.currentTarget, e.relatedTarget))
delayhidemenu()
}
function hidemenu(e){
if (typeof dropmenuobj!="undefined"){
if (ie4||ns6)
dropmenuobj.style.visibility="hidden"
}
}
function delayhidemenu(){
if (ie4||ns6)
delayhide=setTimeout("hidemenu()",disappeardelay)
}
function clearhidemenu(){
if (typeof delayhide!="undefined")
clearTimeout(delayhide)
}
if (hidemenu_onclick=="yes")
document.onclick=hidemenu
en que necesito ayuda....???
1. como hago para que el menu no desaparezca cuando hago click en una opcion??
2. como hago para que cuando "pinto" opcion de rojo siga "pintada" cuando vuelvo a desplegar el menu.....???
Gracias