Hola genios,
Conseguí este código para un menú desplegable y funciona perfectamente, pero no puedo hacer que aparezca donde yo quiero.
(el código está armado para funcionar con onMuseover o con onClick, para que se depliegue el menú, pero yo solo quiero usar onMuseover, pero ese no es el problema).
Mi pregunta es: que valores hay que cambiar o que hay que agregarle o quitarle al código, para que la esquina izquierda superior del menú que se despliega, aparezca, por ejemplo, a partir del borde derecho de la imagen que sería el botón y a la altura de éste.
No se si me explico bien, o sea, que el menú se depliegue en la posición donde termina el botón y a la misma altura que el botón y no en cualquier parte de la página, o sea, en la posición predeterminada que ya trae el código.
Pude modificar los links, y el formato del texto, pero no la posición donde aparece.
aah, lo que tampoco pude hacer es sacarle el subrayado a los links. Si me ayudan con esto también les agradezco.
Por las dudas les comento que estoy trabajando en Front Page y, aparte de este código, lo único que hay es HTML.
Bueno, desde ya quedo infinitamente agradecido si me dan una manito con esto.
Saludos cordiales,
Danilo
<head>
<style type="text/css">
#dropmenudiv{
position:absolute;
border:0px solid black;
font:normal 12px Verdana;
line-height:20px;
z-index:100;
}
</style>
/***********************************************
* AnyLink Drop Down Menu- © Dynamic Drive (www.dynamicdrive.com)
* This notice MUST stay intact for legal use
* Visit http://www.dynamicdrive.com/ for full source code
***********************************************/
//Contents for menu 1
var menu1=new Array()
menu1[0]='<a href="http://www.javascriptkit.com"><b><font face="Arial" size="2" color="#225341"> Fármacos Veterinarios</font></b></a><br>'
menu1[1]='<a href="http://www.freewarejava.com"><b><font face="Arial" size="2" color="#225341"> Fitofármacos</font></b></a><br>'
menu1[2]='<a href="http://codingforums.com"><b><font face="Arial" size="2" color="#225341"> Nutrición y Alimentación animal</font></b></a><br>'
menu1[3]='<a href="http://builder.com"><b><font face="Arial" size="2" color="#225341"> Semillas y Fertilizantes</font></b></a><br>'
menu1[4]='<a href="http://builder.com"><b><font face="Arial" size="2" color="#225341"> Suplementación Mineral</font></b></a><br>'
menu1[5]='<a href="http://builder.com"><b><font face="Arial" size="2" color="#225341"> Alambrados, Postes y Piques</font></b></a><br>'
menu1[6]='<a href="http://builder.com"><b><font face="Arial" size="2" color="#225341"> Lubricantes, Cubiertas y Baterías</font></b></a><br>'
//Contents for menu 2, and so on
var menu2=new Array()
menu2[0]='<a href="http://cnn.com">CNN</a><br>'
menu2[1]='<a href="http://msnbc.com">MSNBC</a><br>'
menu2[2]='<a href="http://news.bbc.co.uk">BBC News</a><br>'
var menuwidth='165px' //default menu width
var menubgcolor='f3efe0' //menu bgcolor
var disappeardelay=500 //menu disappear speed onMouseout (in miliseconds)
var hidemenu_onfiltered="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+'" onfiltered="clearhidemenu()" onfiltered="dynamichide(event)"></div>')
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=-500
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=-150
if (whichedge=="rightedge"){
var windowedge=ie4 && !window.opera? iecompattest().scrollLeft+iecompattest().clientWid th-150 : window.pageXOffset+window.innerWidth-15
dropmenuobj.contentmeasure=dropmenuobj.offsetWidth
if (windowedge-dropmenuobj.x < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure-obj.offsetWidth
}
else{
var windowedge=ie4 && !window.opera? iecompattest().scrollTop+iecompattest().clientHeig ht-150 : window.pageYOffset+window.innerHeight-18
dropmenuobj.contentmeasure=dropmenuobj.offsetHeigh t
if (windowedge-dropmenuobj.y < dropmenuobj.contentmeasure)
edgeoffset=dropmenuobj.contentmeasure+obj.offsetHe ight
}
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_onfiltered=="yes")
document.onfiltered=hidemenu
</script>
<head>
<body>
<tr>
<td width="100%">
<a href="" onfiltered="return clickreturnvalue()" onfiltered="dropdownmenu(this, event, menu1, '220px')" onfiltered="delayhidemenu()">
<img border="0" src="images/botones/productos.jpg" width="177" height="27"></a></td>
</td>
</tr>
</body>
