Avatar billede cdc Novice
21. november 2002 - 21:22 Der er 36 kommentarer og
1 løsning

onMouseout problemer i menu

Har denne menu, hvor jeg tester lidt javascript og css.
Når layeret vises med link har jeg kun muligheder for at lave en onmouseout på den nederste.
kan man lave en onmouseout på tabellen, div'en eller celle, og samtidig bibeholde linksene i layeret, så den ikke bliver stående og glo hvis man ikke vælger noget?

http://hjem.get2net.dk/arntsen/eksperten/menu/menu.htm

/cdc
Avatar billede midas_dk Nybegynder
22. november 2002 - 09:03 #1
Hvorfor kan du ikke have onmouseout på alle menupunkter?
Avatar billede cdc Novice
22. november 2002 - 09:10 #2
for så vil layeret forsvinde/hide inden man går ned på neste link
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:15 #3
<script type="text/JavaScript">
<!--
function findObj(theObj, theDoc) {
  var p, i, foundObj; 
  if(!theDoc) theDoc = document;
  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)  {
    theDoc = parent.frames[theObj.substring(p+1)].document;
    theObj = theObj.substring(0,p);  }
  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
  for (i=0; !foundObj && i < theDoc.forms.length; i++)
    foundObj = theDoc.forms[i][theObj];
  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
    foundObj = findObj(theObj,theDoc.layers[i].document);
  if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj); 
  return foundObj;
}

function skjulDiv(evt) {
var b,relT,mT=false;
if(document.layers){b=evt.target;if(b.pEaHide){
  b.visibility="hidden";}else{routeEvent(evt);}
}else if(document.all&&!window.opera){b=event.srcElement;
  while(b!=null){if(b.tagName=="DIV" && b.pEahD){mT=true;break;}b=b.parentElement;}
  if(!b.contains(event.toElement)){b.style.visibility="hidden";}
}else if(document.getElementById){b=evt.currentTarget;relT=evt.relatedTarget;
  while(relT!=null){if(b==relT){mT=true;break;}
  relT=relT.parentNode;}if(!mT){b.style.visibility="hidden";}}
}

function autoSkjul() {
var i,g,args=autoSkjul.arguments;
for(i=0;i<args.length;i++){if((g=findObj(args[i]))!=null){
  g.pEaHide=true;if(document.layers){
  g.captureEvents(Event.MOUSEOUT);}g.onmouseout=skjulDiv;g.pEahD=true;}}
}
//-->
</script>

og

<body onload="autoSkjul('L1')"

prøv det engang
Avatar billede cdc Novice
22. november 2002 - 09:20 #4
jeg for en fejl, et object var ventet, i linie 68 tegn 1
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:23 #5
Har du husket at lukke <body> :) Det havde jeg ikke.
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:23 #6
Well, det konfliter med dit eksisterende script. 2 sek.
Avatar billede cdc Novice
22. november 2002 - 09:23 #7
ja :o)
Avatar billede cdc Novice
22. november 2002 - 09:28 #8
det virker nu pelkjaer, jeg skiftede bare det jeg havde ud med dit, men er der behov for begge scripts ?
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:31 #9
Alt det jeg postede er nødvendigt. Det det gør er at når du bevæger musen fra layeret og ned skjules det auto. Til siderne etc. kan du bare lægge et closer layer, det plejer jeg at gøre.

Her er et show/hide script der ikke konflikter:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type='text/css'>
<!--
A.menu:link {color: #ffffff; text-decoration: none; font-size: 8pt;}
A.menu:visited {color: #ffffff; text-decoration: none; font-size: 8pt;}
A.menu:active {color: #0D6D93; text-decoration: none; font-size: 8pt;}
A.menu:hover {color: #0D6D93; text-decoration: none; font-size: 8pt;}
A.submenu:link {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:visited {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:active {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:hover {color: #ffffff; text-decoration: none;font-size: 8pt;}

.menustruc {position: absolute; top: 4px; visibility: visible;}
.layer01 {position: absolute; top: 25px; left: 13px; visibility: hidden;}
-->
</style>
<script type="text/JavaScript">
<!--
// Example: showHideLayers(Layer1,'','show',Layer2,'','hide');

function findObj(theObj, theDoc) {
  var p, i, foundObj; 
  if(!theDoc) theDoc = document;
  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)  {
    theDoc = parent.frames[theObj.substring(p+1)].document;
    theObj = theObj.substring(0,p);  }
  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
  for (i=0; !foundObj && i < theDoc.forms.length; i++)
    foundObj = theDoc.forms[i][theObj];
  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
    foundObj = findObj(theObj,theDoc.layers[i].document);
  if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj); 
  return foundObj;
}

function showHideLayers() {
  var i, visStr, obj, args = showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) {
    if ((obj = findObj(args[i])) != null)  {
      visStr = args[i+2];
      if (obj.style)    {
        obj = obj.style;
        if(visStr == 'show') visStr = 'visible';
        else if(visStr == 'hide') visStr = 'hidden';}
      obj.visibility = visStr;}
  }
}

function skjulDiv(evt) {
var b,relT,mT=false;
if(document.layers){b=evt.target;if(b.pEaHide){
  b.visibility="hidden";}else{routeEvent(evt);}
}else if(document.all&&!window.opera){b=event.srcElement;
  while(b!=null){if(b.tagName=="DIV" && b.pEahD){mT=true;break;}b=b.parentElement;}
  if(!b.contains(event.toElement)){b.style.visibility="hidden";}
}else if(document.getElementById){b=evt.currentTarget;relT=evt.relatedTarget;
  while(relT!=null){if(b==relT){mT=true;break;}
  relT=relT.parentNode;}if(!mT){b.style.visibility="hidden";}}
}

function autoSkjul() {
var i,g,args=autoSkjul.arguments;
for(i=0;i<args.length;i++){if((g=findObj(args[i]))!=null){
  g.pEaHide=true;if(document.layers){
  g.captureEvents(Event.MOUSEOUT);}g.onmouseout=skjulDiv;g.pEahD=true;}}
}
//-->
</script>
</head>
<body onload="autoSkjul('L1')">
<div id="L4" class="menustruc">
    <table width="100" nowrap cellspacing="0" cellpadding="0" border="0">
    <tr>
    <td align="right"><a class="menu" href="ref.htm" onFocus="blur()" target="right" onmouseover="showHideLayers('L1','','show')"><img border="0" src="language.gif" align="left" width="81" height="21"></a>
    </a>
    </td>
    </tr>
    </table>
</div>
<div id="L1" class="layer01" style="width: 72">
    <table width="81" cellspacing="0" cellpadding="0" border="1">
    <tr>
    <td bgcolor="#C0C0C0">
        <div align="right">
        <p align="left">&nbsp;<a class="submenu" href="refweb_01.html" onFocus="blur()" target="right">German<br>
        </a>&nbsp;<a class="submenu" href="refmaster.html"onFocus="blur()" target="right">Danish</a>
        </div>
    </td>
    </tr>
    </table>
</div>
</body>
</html>
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:32 #10
Ups..kommentaren

// Example: showHideLayers(Layer1,'','show',Layer2,'','hide');

skal være

// Example: showHideLayers('Layer1','','show','Layer2','','hide');
Avatar billede cdc Novice
22. november 2002 - 09:36 #11
Takker for hjælpen :o)
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:38 #12
velbekomme.
Avatar billede nikolajdu Nybegynder
22. november 2002 - 09:41 #13
'Jeg får da fejl nu?
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:42 #14
ja det gør jeg sq' ikke..
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:43 #15
Jo vent lidt, hvad fa* er det jeg har postet - da ikke det jeg selv testede uden fejl :=
Avatar billede nikolajdu Nybegynder
22. november 2002 - 09:44 #16
lol
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:45 #17
Så skulle den være der

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title></title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type='text/css'>
<!--
A.menu:link {color: #ffffff; text-decoration: none; font-size: 8pt;}
A.menu:visited {color: #ffffff; text-decoration: none; font-size: 8pt;}
A.menu:active {color: #0D6D93; text-decoration: none; font-size: 8pt;}
A.menu:hover {color: #0D6D93; text-decoration: none; font-size: 8pt;}
A.submenu:link {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:visited {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:active {color: #0D6D93; text-decoration: none;font-size: 8pt;}
A.submenu:hover {color: #ffffff; text-decoration: none;font-size: 8pt;}

.menustruc {position: absolute; top: 4px; visibility: visible;}
.layer01 {position: absolute; top: 25px; left: 13px; visibility: hidden;}
-->
</style>
<script type="text/JavaScript">
<!--
function findObj(theObj, theDoc) {
  var p, i, foundObj; 
  if(!theDoc) theDoc = document;
  if( (p = theObj.indexOf("?")) > 0 && parent.frames.length)  {
    theDoc = parent.frames[theObj.substring(p+1)].document;
    theObj = theObj.substring(0,p);  }
  if(!(foundObj = theDoc[theObj]) && theDoc.all) foundObj = theDoc.all[theObj];
  for (i=0; !foundObj && i < theDoc.forms.length; i++)
    foundObj = theDoc.forms[i][theObj];
  for(i=0; !foundObj && theDoc.layers && i < theDoc.layers.length; i++)
    foundObj = findObj(theObj,theDoc.layers[i].document);
  if(!foundObj && document.getElementById) foundObj = document.getElementById(theObj); 
  return foundObj;
}

function showHideLayers() {
  var i, visStr, obj, args = showHideLayers.arguments;
  for (i=0; i<(args.length-2); i+=3) {
    if ((obj = findObj(args[i])) != null)  {
      visStr = args[i+2];
      if (obj.style)    {
        obj = obj.style;
        if(visStr == 'show') visStr = 'visible';
        else if(visStr == 'hide') visStr = 'hidden';}
      obj.visibility = visStr;}
  }
}

function skjulDiv(evt) {
var b,relT,mT=false;
if(document.layers){b=evt.target;if(b.pEaHide){
  b.visibility="hidden";}else{routeEvent(evt);}
}else if(document.all&&!window.opera){b=event.srcElement;
  while(b!=null){if(b.tagName=="DIV" && b.pEahD){mT=true;break;}b=b.parentElement;}
  if(!b.contains(event.toElement)){b.style.visibility="hidden";}
}else if(document.getElementById){b=evt.currentTarget;relT=evt.relatedTarget;
  while(relT!=null){if(b==relT){mT=true;break;}
  relT=relT.parentNode;}if(!mT){b.style.visibility="hidden";}}
}

function autoSkjul() {
var i,g,args=autoSkjul.arguments;
for(i=0;i<args.length;i++){if((g=findObj(args[i]))!=null){
  g.pEaHide=true;if(document.layers){
  g.captureEvents(Event.MOUSEOUT);}g.onmouseout=skjulDiv;g.pEahD=true;}}
}
//-->
</script>
</head>
<body onload="autoSkjul('L1')">
<div id="L4" class="menustruc">
    <table width="100" nowrap cellspacing="0" cellpadding="0" border="0">
    <tr>
    <td align="right"><a class="menu" href="ref.htm" onFocus="blur()" target="right" onmouseover="showHideLayers('L1','','show')"><img border="0" src="language.gif" align="left" width="81" height="21"></a>
    </a>
    </td>
    </tr>
    </table>
</div>
<div id="L1" class="layer01" style="width: 72">
    <table width="81" cellspacing="0" cellpadding="0" border="1">
    <tr>
    <td bgcolor="#C0C0C0">
        <div align="right">
        <p align="left">&nbsp;<a class="submenu" href="refweb_01.html" onFocus="blur()" target="right">German<br>
        </a>&nbsp;<a class="submenu" href="refmaster.html"onFocus="blur()" target="right">Danish</a>
        </div>
    </td>
    </tr>
    </table>
</div>
</body>
</html>
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:46 #18
Der sker altså et eller andet når man paster herind... jeg uploader istedet
Avatar billede nikolajdu Nybegynder
22. november 2002 - 09:48 #19
Indrøm nu bare du har lavet noget sjuskt ;-)
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:48 #20
Avatar billede cdc Novice
22. november 2002 - 09:51 #21
det ser ikke godt ud det du har lavet på linket, den virker ikke :o)
Men det virker hos mig nu, bare med den først, så kigger jeg lidt på den anden, når jeg kommer hjem fra arb.
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:52 #22
Jeg forstår ingenting nu - hvad er det på linket der ikke virker?
Avatar billede nikolajdu Nybegynder
22. november 2002 - 09:52 #23
Den virker da hos mig :)
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:54 #24
Her virker det fint i IE, NN4, NS6 og Opera 6.
Avatar billede cdc Novice
22. november 2002 - 09:54 #25
nu virker det :o) Tanx endnu engang, troede jeg havde sat jer på en for stor opgave da der ingen svar var i går :o)
Avatar billede pelkjaer Nybegynder
22. november 2002 - 09:57 #26
Det var nok kun nikolaj der var online igår *LOOOL*
Avatar billede cdc Novice
22. november 2002 - 09:58 #27
*LOL*
Avatar billede nikolajdu Nybegynder
22. november 2002 - 10:09 #28
Hrmfp!!
Avatar billede cdc Novice
10. december 2002 - 00:57 #29
pelkjaer--> Hvis du kører musen væk fra selve linket bliver undermenuen/dropdownmenuen stående, er der en løsning for dette ?

/cdc
Avatar billede cdc Novice
10. december 2002 - 00:59 #30
Avatar billede pelkjaer Nybegynder
10. december 2002 - 10:29 #31
Jeg plejer at lægge en transparent gif umiddelbart lige over menu trickerne som ved onmouseover skjuler menuerne. Evt. også umiddelbart til højre og til venstre for menuen.

Kommer lidt an på hvordan layoutet er, men i dit tilfælde vil det lige kunne lade sig gøre (der er ikke meget plads til toppen).
Avatar billede cdc Novice
10. december 2002 - 10:33 #32
En god idé, den prøver jeg lige når jeg kommer hjem
Avatar billede cdc Novice
10. december 2002 - 10:35 #33
Avatar billede nikolajdu Nybegynder
10. december 2002 - 12:55 #34
cdc - Din menu dutter ikke så fedt i NS 7... :(
Avatar billede cdc Novice
10. december 2002 - 12:59 #35
ved det godt, er også bare i begynder fasen, noget jeg sidder at roder med når jeg keder mig. Er ikke noget jeg skal bruge nu :o)
Avatar billede nikolajdu Nybegynder
10. december 2002 - 12:59 #36
oki doki - Ville bare nævne det :)
Avatar billede cdc Novice
10. december 2002 - 13:05 #37
takker aligevel
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