Avatar billede abeass Nybegynder
17. februar 2006 - 12:53 Der er 3 kommentarer

Problemer med OnMouseOver

Hej

Jeg har et problem, når jeg bruger OnMouseOver.

Den boks, jeg får frem kan ikke vises ordentligt, når den er henover et select-felt. Den vises korrekt, når den IKKE er henover et select-felt (der er f.eks. ingen problemer henover et input-felt).

Du/I kan eventuelt prøve det selv - jeg har vedlagt min kode til min html-fil (Side1.htm) og min JavaScript-fil (Side1.js) nedenfor.

Håber du/I kan hjælpe..?!

/abeass

*****************************************************************

<html>
<head>
<title></title>
<SCRIPT language=JavaScript src="Side1.js"></SCRIPT>
</head>
<body>
<form name="data">
  <table border="0" cellspacing="0" cellpadding="5">
    <tr>
      <td>V&AElig;LG<img src="dot.gif" width="5" height="18"><IMG onmouseover="openHelp('V&aelig;lg Ja eller Nej.',true)" style="CURSOR: hand" onmouseout=closeHelp() height=14 alt="" src="ikon_i.gif" width=14 align=absMiddle border=0></td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>&nbsp;</td>
      <td><select name="VAELG" class="standard">
        <option selected value="Nej">Nej</option>
        <option value="Ja">Ja</option>
      </select></td>
    </tr>
    <tr>
      <td>V&AElig;LG<img src="dot.gif" width="5" height="18"><IMG onmouseover="openHelp('V&aelig;lg Ja eller Nej.',true)" style="CURSOR: hand" onmouseout=closeHelp() height=14 alt="" src="ikon_i.gif" width=14 align=absMiddle border=0></td>
      <td>&nbsp;</td>
    </tr>
  </table>
</form>
<DIV id=divHelp style="Z-INDEX: 1000; VISIBILITY: hidden; WIDTH: 200px; POSITION: absolute" name="divHelp"></DIV>
</body>
</html>

*****************************************************************

// JavaScript Document

/*Browsertype og version*/
version = parseInt(navigator.appVersion);

if (navigator.appVersion.indexOf('5.')>-1) {
    version=5
}
browser='OTHER';
if (navigator.appName == 'Netscape') {
    browser = 'NS'+version;
}
if (navigator.appName == 'Microsoft Internet Explorer') {
    browser = 'MSIE'+version;
}
if (navigator.appVersion.indexOf('MSIE 3') > 0) {
    browser = 'MSIE3';
}

/*Mouseover funktion*/
function MM_swapImgRestore() { //v3.0
  var i,x,a=document.MM_sr;
      for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++)
        x.src=x.oSrc;
}

function MM_preloadImages() { //v3.0
  var d=document;
  if(d.images) {
    if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments;
        for(i=0; i<a.length; i++)
            if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];
        }
    }
}

function MM_findObj(n, d) { //v4.0
  var p,i,x;
  if(!d) d=document;
      if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);
    }
      if(!(x=d[n])&&d.all) x=d.all[n];
        for (i=0;!x&&i<d.forms.length;i++)
            x=d.forms[i][n];
              for(i=0;!x&&d.layers&&i<d.layers.length;i++)
                  x=MM_findObj(n,d.layers[i].document);
                  if(!x && document.getElementById)
                  x=document.getElementById(n); return x;
}

function MM_swapImage() { //v3.0
  var i,j=0,x,a=MM_swapImage.arguments;
  document.MM_sr=new Array;
      for(i=0;i<(a.length-2);i+=3)
          if ((x=MM_findObj(a[i]))!=null) {
            document.MM_sr[j++]=x;
            if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];
        }
}

/*Layer til info-i'et*/
var Ymouse = Xmouse = 0;

//finder musens position
function Mouse(evnt) {
    if (browser == "MSIE4") {
        Ymouse=event.y+10;
        } else {
        Ymouse=event.y+document.body.scrollTop+10;
        }
  Xmouse=event.x+10;
}
document.onmousemove=Mouse;

//åbner hjælpeboks
var opac = 0;
function openHelp(txt,s) {
    for(i=0; i<document.data.elements.length; i++) {
        if(!s && (document.data.elements[i].type == "select-one" && (document.data.elements[i].className == "bred" || document.data.elements[i].className == "bred_error" || document.data.elements[i].className == "standard" || document.data.elements[i].className == "standard_error"))) {
            document.data.elements[i].style.display = "none";
        }
    }

    var txtInsert = "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr><td bgcolor='#999999'><img src='dot.gif' width='1' height='1' border='0'></td></tr></table>";
    txtInsert = txtInsert + "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr height='6'><td width='1' bgcolor='#999999'></td><td width='194' bgcolor='#EEEEE7'></td><td width='1' bgcolor='#999999'></td></tr></table>";
    txtInsert = txtInsert + "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr height='16'><td width='1' bgcolor='#999999'></td><td width='30' bgcolor='#EEEEE7' align='center'><img src='ikon_info_stor.gif' width='20' height='20' border='0' alt=''></td>";
    txtInsert = txtInsert + "<td width='172' bgcolor='#EEEEE7'></td><td width='1' bgcolor='#999999'></td></tr></table>";
    txtInsert = txtInsert + "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr valign='top'><td width='1' bgcolor='#999999'></td><td width='30' bgcolor='#EEEEE7'></td>";
    txtInsert = txtInsert + "<td width='158' bgcolor='#EEEEE7'>"+txt+"</td><td width='10'  bgcolor='#EEEEE7'></td><td width='1' bgcolor='#999999'></td></tr></table>";
    txtInsert = txtInsert + "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr height='26'><td width='1' bgcolor='#999999'></td><td width='212' bgcolor='#EEEEE7'>&nbsp;</td><td width='1' bgcolor='#999999'></td></tr></table>";
    txtInsert = txtInsert + "<table width='200' cellpadding='0' cellspacing='0' border='0'><tr><td bgcolor='#999999'><img src='dot.gif' width='1' height='1' border='0'></td></tr></table>";

    document.all.divHelp.innerHTML = txtInsert;
    document.all.divHelp.style.visibility = 'visible';
    document.all.divHelp.style.left = Xmouse;
    document.all.divHelp.style.top = Ymouse;

}


//lukker hjælpeboks
function closeHelp() {
    for(i=0; i<document.data.elements.length; i++) {
        if(document.data.elements[i].type == "select-one" && (document.data.elements[i].className == "bred" || document.data.elements[i].className == "bred_error" || document.data.elements[i].className == "standard" || document.data.elements[i].className == "standard_error")) {
            document.data.elements[i].style.display = "";
        }
    }
    document.all.divHelp.innerHTML = "";
    document.all.divHelp.style.visibility = 'hidden';
}

function MM_jumpMenu(targ,selObj,restore){ //v3.0
  eval(targ+".location='"+selObj.options[selObj.selectedIndex].value+"'");
  if (restore) selObj.selectedIndex=0;
}
Avatar billede roenving Novice
17. februar 2006 - 16:22 #1
Tjah, der findes en gruppe html-elementer, der vises i deres helt eget rum foran alle andre htm-elementer, deriblandt select-bokse ...

-- det kan du ikke gøre noget ved, men må i stedet over i den slags løsninger, som f.eks. dette site også bruger: skjul de bokse, der kan komme i vejen !-)

-- hvis du går ud i en oversigt over en kategori her på Eksperten, vil du se, at de select-bokse, der ellers vises, skjules, når de forskellige menu-ting åbnes ...

-- og jeg forstår ikke rigtigt, at du har et problem, medmindre du har selects udenfor data-formen ?-)

-- og det ser ud til, at du ved, at alle brugere benytter sig af M$IE !o]
Avatar billede abeass Nybegynder
21. februar 2006 - 15:46 #2
Jeg skal lige være helt sikker på, at jeg forstår dig korrekt...

Jeg har lavet en løsning, hvor select-boksene skjules, når musen holdes over det pågældende billede. Jeg synes bare, at det virker meget forvirrende for brugeren...

Jeg kan ikke finde det sted her på siden (Eksperten), som du gav som eksempel..? Hvor er det præcist?

Det næstsidste du skriver ("og jeg forstår ikke rigtigt, at du har et problem, medmindre du har selects udenfor data-formen ?-)") forvirrer mig en smule...
Mine selects er inde i data-formen, men jeg oplever da bestemt problemet med OnMouseOver-effekten...

Jeg håber, jeg kan få dig til at uddybe dit svar lidt - please :-)

Mht. MSIE er det ikke noget problem - alle brugere, der skal bruge siden benytter MSIE...
Avatar billede roenving Novice
25. februar 2006 - 17:58 #3
Hvis du går ud i en kategor-oversigt, f.eks. http://www.eksperten.dk/spm/Programmering/Script/JavaScript/ og trykker på Kategrioversigt i menuen i toppen og ruller ned over mulighederne, vil du se, at sorteringsboksene skjules, når de kan være i vejen for undermenuerne !-)
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