Salve a tutti ho fatto delle prove con il vostro script (link) .
Funziona bene ma ho notato un piccolo problema.
Con firefox tutto bene, con netscape anche, indovinate un pò con IE il menù non appare sulla posizione precisa del mouse.
Piu precisamente lo fa fino all'altezza di base della pagina, scorrendo la pagina verso il basso invece segue la direzione del mouse si, ma il menu appare in alto quindi non visibile (a meno che non si sale su con la scroll bar della pagina).
mi affido a voi perchè ho provato ma non sono riuscito a venirne a capo.
mi sono preso la briga però di fare in modo che il menu sparisca sia al click destro che sinistro del mouse,aggiungo appunto il codice (cn questa lieve modifica che non va in conflitto cn il codice, provato già :P)
codice:
<script language="javascript">
var menuNormColor="#f0f0f0";
var menuHoverColor="#6873f8";
var enableShadow=true;
var enableShadowTransparency=true;
var disableNS4=false;
var menu=new Array();
menu[0]=['<div align=\"center\">.: MENU :.</div>'];
menu[1]=['Home' , 'link.php' , '_self'];
ns4 = (navigator.appName.indexOf("Netscape")>=0 && document.layers)? true : false;
ie4 = (document.all && !document.getElementById)? true : false;
ie5 = (document.all && document.getElementById)? true : false;
ns6 = (document.getElementById && navigator.appName.indexOf("Netscape")>=0 )? true: false;
w3c = (document.getElementById)? true : false; var mx=0;
var my=0;
var conmenu;
var conshadow;
var windowloaded=false;
var opened=false;
var ch=0; var cw=0;
function setc(ref,c){ if(ns4)ref.bgColor=c; else ref.style.backgroundColor=c; }
var txt='<div id="conshadow"> </div>'; txt+='<div id="conmenu">';
for(i=0;i<menu.length;i++){ if(menu[i].length<3){
txt+='<ilayer><div class="normtext">'+menu[i][0]+'</div></ilayer>';
}else{
txt+=(ns4)?'<ilayer width="100%" bgcolor="'+menuNormColor+'">
<layer width="100%" onmouseover="setc(this,\''+menuHoverColor+'\')"
onmouseout="setc(this,\''+menuNormColor+'\')">':'
<div class="link" style="background-color:'+menuNormColor+'"
onmouseover="setc(this,\''+menuHoverColor+'\')"
onmouseout="setc(this,\''+menuNormColor+'\')">';
txt+=''+menu[i][0]+'';
txt+=(ns4)?'</layer></ilayer>':'</div>'; }
}
txt+='</div>'; document.write(txt); function ns4trap(evt){
if(evt.which==2||evt.which==3){ showmenu(); return false; }}
function showmenu(){
if(windowloaded){
if(opened){
if(ns4){
conmenu.visibility="hide";
conshadow.visibility="hide";
conmenu.moveTo(0,0);
conshadow.moveTo(0,0);
}else{
conmenu.style.visibility="hidden";
conshadow.style.visibility="hidden";
conmenu.style.left='0px';
conmenu.style.top='0px';
conshadow.style.left='0px';
conshadow.style.top='0px'; }
opened=false;
}else{
opened=true;
var wh=(ie4||ie5)?document.body.clientHeight:window.innerHeight;
var ww=(ie4||ie5)?document.body.clientWidth:window.innerWidth;
var sx=(ie4||ie5)?document.body.scrollLeft:pageXOffset;
var sy=(ie4||ie5)?document.body.scrollTop:pageYOffset;
if(ie4||ie5){
if(mx+cw+13>=ww)mx=mx-cw-13;
if(my+ch+13>=wh)my=my-ch-13;
}else{
if(mx+cw-sx+13>=ww)mx=mx-cw-13;
if(my+ch-sy+13>=wh)my=my-ch-13; }
if(ns4){ conmenu.moveTo(mx,my);
conmenu.visibility="show";
conshadow.moveTo(mx+8,my+8);
if(enableShadow)conshadow.visibility="show";
}else{
conmenu.style.left=mx+((ie4||ie5)?sx:0)+'px';
conmenu.style.top=my+((ie4||ie5)?sy:0)+'px';
conshadow.style.left=mx+10+((ie4||ie5)?sx:0)+'px';
conshadow.style.top=my+10+((ie4||ie5)?sy:0)+'px';
setTimeout('conmenu.style.visibility="visible";
if(enableShadow)conshadow.style.visibility="visible"; ',50); }}}}
if(ns4&&!disableNS4)
{ document.captureEvents(Event.MOUSEDOWN|Event.MOUSEMOVE);
document.onmousedown=ns4trap;
}else{
document.oncontextmenu=function(){ showmenu();
return false; }}
document.onmousemove=function(evt){ mx=(ie4||ie5)?event.clientX:evt.pageX;
my=(ie4||ie5)?event.clientY:evt.pageY;
} window.onload=function(){ windowloaded=true;
conmenu=(ns4)?document.layers['conmenu']:
(ie4)?document.all['conmenu']:document.getElementById('conmenu');
conshadow=(ns4)?document.layers['conshadow']:
(ie4)?document.all['conshadow']:document.getElementById('conshadow');
ch=(ns4)?conmenu.document.height:
(ie4||ie5)?conmenu.clientHeight:conmenu.offsetHeight;
cw=(ns4)?conmenu.document.width:
(ie4||ie5)?conmenu.clientWidth:conmenu.offsetWidth;
if(ns4){
conshadow.clip.height=conmenu.document.height; conshadow.clip.width=conmenu.document.width;
conmenu.clip.bottom=conmenu.document.height;
}else{
if(enableShadowTransparency){
if(ie4||ie5)conshadow.style.filter="alpha(opacity=50)";
if(ns6||!ie4||!ie5)conshadow.style.MozOpacity=.5; }
conshadow.style.height=ch+((ie4||ie5)?4:0);
conshadow.style.width=cw+((ie4||ie5)?4:0);
} }
window.onresize=function()
{ if(ns4)setTimeout('history.go(0)',200);
}
function handleEvent(Event) {
if (Event.button==0) {
if(opened)showmenu(); }
}
//codice x il tasto sinistro è necessario mettere sul body -> onclick="handleEvent(event)"
</script>
Fatemi sapere *_*....io intanto vi linko una pagina demo dove è possibile notare il problema.
(basta scorrere in basso e aprire il menu premendo il tasto destro del mouse).
http://worldfantasy.netsons.org/esempio.htm
(Naturalmente apritelo con IE è li che si nota il bug)