Avatar billede krogstrup Nybegynder
01. juni 2004 - 16:31 Der er 9 kommentarer og
1 løsning

Problemer med visning af højrekliks menu

Jeg bruger dette script til visning af mine egne højrekliksmenuer på links i et CMS system:

function showOptions(l) {

st = document.getElementById(l).style
st.display = "inline";
st.top  = event.clientY + document.body.scrollLeft - 5;
st.left = event.clientX + document.body.scrollTop - 5;

}


Men når listen af links er lang, får jeg et rigtig grimt problem. Links der kan ses i bunden af skærmen (uden at man scroller) reagerer korrekt på et højreklik, men mit lag bliver jo fortsat vist under link´et som planlagt, og det er jo ikke så smart, da man således ikke kan se indholdet at mit højreklikslag.

Et endnu større problem er hvis man scroller i listen og så højreklikker på et lag, så går positioneringen af mine højreklikslag fuldtstændig agurk !

Se eks her: http://krogstrup.dk/rightclick.asp

Jeg håber der kan findes en løsning på:

1) Script skal undersøge om der er plads til at vise mit højreklikslag under det respektive link, hvis ikke skal laget vises OVER linket i stedet for UNDER.

2) Selv om der scrolles på siden, skal højreklikslag fortsat positioneres korrekt.


Anyone :-)

/David
Avatar billede grunken Nybegynder
01. juni 2004 - 16:45 #1
hmm - et hurtigt kig afslører en fatal fejl !

st.top  = event.clientY + document.body.scrollLeft - 5;
st.left = event.clientX + document.body.scrollTop - 5;

skal skiftes ud med:

st.top  = event.clientY + document.body.scrollTop - 5;
st.left = event.clientX + document.body.scrollLeft - 5;

kan du se forskellen ? :o)
Avatar billede grunken Nybegynder
01. juni 2004 - 16:46 #2
-og 1 kommer så lige om lidt :o)
Avatar billede krogstrup Nybegynder
01. juni 2004 - 16:59 #3
hehe - ja det kan jeg godt se :-)

takker mange gange - det løser 100% problem 2 !!!!

Glæder mig til at få løst 1 ´eren....

:-)
Avatar billede grunken Nybegynder
01. juni 2004 - 17:00 #4
grib :o)

function showOptions(l) {
st = document.getElementById(l).style
st.display = "inline";
lagh = document.getElementById(l).offsetHeight;
st.top = (document.body.offsetHeight-(event.clientY + document.body.scrollTop-5)>lagh)?(event.clientY+document.body.scrollTop-5)+"px":(event.clientY+document.body.scrollTop-(lagh+5))+"px"
st.left = event.clientX + document.body.scrollLeft - 5;
}
Avatar billede grunken Nybegynder
01. juni 2004 - 17:05 #5
og ikke helt :o)
Avatar billede grunken Nybegynder
01. juni 2004 - 17:09 #6
sådan :o)

function showOptions(l) {
st = document.getElementById(l).style
st.display = "inline";
lagh = document.getElementById(l).offsetHeight;
st.top = ((document.body.offsetHeight-event.clientY)>lagh)?(event.clientY+document.body.scrollTop-5)+"px":(event.clientY+document.body.scrollTop-(lagh-5))+"px"
st.left = event.clientX + document.body.scrollLeft - 5;
}
Avatar billede krogstrup Nybegynder
02. juni 2004 - 10:08 #7
hej igen grunken

hvad kan jeg sige andet end; det fungerer jo bare super perfekt !!!!

TUSIND tak - det var virkelig fedt at få løst det problem

Smider du et svar ?

:-)
Avatar billede krogstrup Nybegynder
02. juni 2004 - 10:13 #8
ja, nu skal jeg jo næsten spørge; ville det være muligt at gøre det på x-aksen også. Således at hvis der højreklikkes så langt til højre på skærmen at laget ikke kan vises til højre for musepilen, så vises laget til venstre i stedet....?

:-)
Avatar billede grunken Nybegynder
02. juni 2004 - 14:15 #9
Jeps det er ud fra næsten samme device!, Jeg har givet funktionen et par variabler, så du måske lettere kan følge idéen i det :o)

function showOptions(l) {
st = document.getElementById(l);
st.style.display = "inline";

lagh = st.offsetHeight;
lagw = st.offsetWidth;

bodh = document.body.offsetHeight;
bodw = document.body.offsetWidth;
bodt = document.body.scrollTop;
bodl = document.body.scrollLeft;

musy = event.clientY;
musx = event.clientX;

st.style.top = ((bodh-musy)>lagh)?(musy+bodt-5)+"px":(musy+bodt-(lagh-5))+"px"
st.style.left = ((bodw-musx)>lagw)?(musx+bodl-5)+"px":(musx+bodl-(lagw-5))+"px"
}

-sidst men ikke mindst er det også lidt mere praktisk for dig at lave en lille funktion til at fjerne contextmenuen helt fra bodyElementet

function nocontext(){
event.cancelBubble = true;
event.returnValue = false;
return false;
}
document.oncontextmenu = nocontext;

hvis du tilføjer disse linier behøves din body ikke en oncontextmenu="return false" <- hvilket heller ikke er særligt korrekt + at de links hvor du "aktiverer" din egen menu kan nøjes med at se sådan ud:

<a href='java script:void(0);' onfocus='this.blur();' oncontextmenu="showOptions('layer1');">Side 1</a>

Men igen, man kan jo blive ved med at optimere :o)

du får et svar - og velbekomme :o)
Avatar billede krogstrup Nybegynder
02. juni 2004 - 14:43 #10
super - tusind tak for din hjælp :-)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester

IT-JOB