Avatar billede kerbs Novice
19. januar 2004 - 11:42 Der er 15 kommentarer og
1 løsning

Dropdown menu - fejl.

Hey Eksperter.

Jeg har tidligere fundet en menu herinde - og har nu prøvet at bruge den - meeen..
http://kerbs.org/test/
Der kommer fejl når jeg kører over knapperne - og jeg har INGEN anelse om det - og ville derfor hører om i ved hvad fejlen kan skyldes? :)

Mvh. Thomas
Avatar billede minus Nybegynder
19. januar 2004 - 11:48 #1
sikker på at linket er rigtig?
det virker ikke ved mig.
Avatar billede kerbs Novice
19. januar 2004 - 11:49 #2
hmm... det skal da lige passe at mit domæne er gået ned nu..
Avatar billede kerbs Novice
19. januar 2004 - 11:51 #3
Det ser ud til at mit domæne pt. er nede :(

Jeg skriver lige efter spise pausen her - og så ser jeg om det er oppe igen.
Avatar billede kerbs Novice
19. januar 2004 - 12:54 #4
Siden er stadig nede .. jeg ved ikke om det kan hjælpe nogle, hvis jeg bare smider hele koden her?
Avatar billede kerbs Novice
19. januar 2004 - 13:18 #5
så kom siden op igen - efter en lille times nedetid..

Håber i kan hjælpe :)
Avatar billede skovenborg Nybegynder
19. januar 2004 - 16:44 #6
du mangler at lave to elementer med id'en Event og Hdgeneral, som du prøver at vise med dine når du flytter musen over linkene.

Så et sted på siden skal du fx lave to div'er:
<div id="Event">Event</div>
<div id="Hdgeneral">Hdgeneral</div>

Og så derudover måske ændre lidt på deres style.
Avatar billede kerbs Novice
20. januar 2004 - 09:29 #7
skovenborg >>

Er det muligt at du vil prøve at skrive hele koden?
Menu punkterne skal bare stå lige under ovenstående menu punkt.. hvis du forstår.. :)
Avatar billede skovenborg Nybegynder
20. januar 2004 - 16:44 #8
jo, prøv sådan her:
<html>
<head>
<title>:::  Næstved Produktionsskole - Version 1  :::</title>
<style>
<!--
p {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; line-height:22px color: #FFFFFF;}
td {  font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px; color: #FFFFFF;}
A:link { text-decoration: none; color: #000000; }
A:visited { text-decoration: none; color: #000000; }
A:hover { text-decoration: none; color: #666666; }
#Event,#Hdgeneral {position:absolute;top:10px;display:none;color:#000;padding-top:3px;width:100px;}
#Event      { left: 3px; }
#Hdgeneral  { left: 90px;}
.menus      { color: #000000; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;
              text-decoration: none }
.menus:hover { color: #999999; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 11px;
              text-decoration: none }
select      { font-family: arial, verdana; font-size: 12px }
input.Small  { font-family: arial, verdana; font-size: 12px }
input        { font-family: arial, verdana; font-size: 12px }
input.Button { font-family: arial, verdana; font-size: 12px }
-->
</style>

<script language=javascript>
//
<!--
window.onerror = null;
var bName = navigator.appName;
var bVer = parseInt(navigator.appVersion);
var NS4 = (bName == "Netscape" && bVer >= 4);
var IE4 = (bName == "Microsoft Internet Explorer" && bVer >= 4);
var NS3 = (bName == "Netscape" && bVer < 4);
var IE3 = (bName == "Microsoft Internet Explorer" && bVer < 4);
var menuActive = 0
var menuOn = 0
var onLayer
var timeOn = null// LAYER SWITCHING CODE
if (NS4 || IE4) {
if (navigator.appName == "Netscape") {
layerStyleRef="layer.";
layerRef="document.layers";
styleSwitch="";
}else{
layerStyleRef="layer.style.";
layerRef="document.all";
styleSwitch=".style";
}
}

// SHOW MENU
layerArr=["Event","Hdgeneral"];
function showLayer(layerName){

if (NS4 || IE4) {
if (timeOn != null) {
clearTimeout(timeOn)
hideLayer(onLayer)
}
if (NS4 || IE4) {
for (i=0;i<layerArr.length;i++)
{
if (layerName == layerArr[i]) {
  if (document.getElementById) document.getElementById(layerArr[i]).style.display="block";
  else eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.display="block"');
}
else hideLayer(layerArr[i]);
}}
onLayer = layerName
}
}// HIDE MENU
function hideLayer(layerName){
if (menuActive == 0) {
if (NS4 || IE4) {
if (layerName) {
  if (document.getElementById) document.getElementById(layerName).style.display = "none";
  else eval(layerRef+'["'+layerName+'"]'+styleSwitch+'.display="none"');
}
}
}
}// TIMER FOR BUTTON MOUSE OUT
function btnTimer() {
timeOn = setTimeout("btnOut()",1000)
}// BUTTON MOUSE OUT
function btnOut(layerName) {
if (menuActive == 0) {
hideLayer(onLayer)
}
}// MENU MOUSE OVER
function menuOver(itemName) {
clearTimeout(timeOn)
menuActive = 1
}// MENU MOUSE OUT
function menuOut(itemName) {
menuActive = 0
timeOn = setTimeout("hideLayer(onLayer)", 400)
}// -->
</SCRIPT>
</head>

<body bgcolor="#FFFFFF" text="#000000" link="#000000" vlink="#000000" alink="#000000" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<table width="697" height="100%" align="center" cellpadding="0" cellspacing="0">
  <tr>
    <td height="152" colspan="2"><img src="images/toplogo.jpg" width="697" height="200"></td>
  </tr>

  <tr>
    <td height="32" colspan="2" style="background-image: url(images\menuspacer.jpg);">
      <div style="position:relative;">
      <font size="1" face="Verdana, Arial, Helvetica, sans-serif"><a class="bigmenus" href="#"  onMouseOver="showLayer('Event')" onmouseout="hideLayer('Event');">OVERVIEW</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="bigmenus" href="#"  onMouseOver="showLayer('Hdgeneral')" onmouseout="hideLayer('Hdgeneral');">EDITING</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="link.htm" onMouseOver="showLayer('')">LINK</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="writer.htm" onMouseOver="showLayer('')">WRITER</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="writer.htm" onMouseOver="showLayer('')">WRITER</a>
      <div id="Event" onMouseOver="showLayer('Event')" onmouseout="hideLayer('Event');">Event</div><div id="Hdgeneral"  onMouseOver="showLayer('Hdgeneral')" onmouseout="hideLayer('Hdgeneral');">Hdgeneral</div>
      </div>
    </td>
  </tr>
  <tr>
    <td width="483" align="left" valign="top" background="images/tekstspacer.jpg"><font size="2" face="Verdana, Arial, Helvetica, sans-serif"><font size="1">Indhold</font></font><font size="1" face="Verdana, Arial, Helvetica, sans-serif">
      mm.</font><font size="1"><br>

        </font></td>
    <td width="214" align="left" valign="top" background="images/tekstspacer2.jpg"><font size="1" face="Verdana, Arial, Helvetica, sans-serif">Kalender
      etc.</font></td>
  </tr>
</table>

</body>
</html>

Jeg har dog lavet lidt om i din funktion - håber ikke det gør noget. Nu burde den også virke i mozilla (med document.getElementById).
Avatar billede kerbs Novice
21. januar 2004 - 09:35 #9
Det gør overhovedet intet at du har ændret det - tværtimod :)

Men det VIRKER! :)
Men et spørgsmål .. Er det ikke muligt at man kan lave flere underpunkter - som links?
Og med en hvid kasse som baggrund eller noed..
Avatar billede skovenborg Nybegynder
21. januar 2004 - 14:11 #10
Jo - teknikken er at de to divbokse med id'en Event og Hdgeneral er bokse som du kan proppe lige hvad du har lyst til ind i (det selvfølgelig ikke alt der ser lige godt ud).

Eksempel (jeg har givet den omkransende div en id så det bliver lettere at tilføje nye i stylesheetet):
<tr>
    <td height="32" colspan="2" style="background-image: url(images\menuspacer.jpg);">
      <div style="position:relative;" id="menu">
      <font size="1" face="Verdana, Arial, Helvetica, sans-serif"><a class="bigmenus" href="#"  onMouseOver="showLayer('Event')" onmouseout="hideLayer('Event');">OVERVIEW</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a class="bigmenus" href="#"  onMouseOver="showLayer('Hdgeneral')" onmouseout="hideLayer('Hdgeneral');">EDITING</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="link.htm" onMouseOver="showLayer('')">LINK</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="writer.htm" onMouseOver="showLayer('')">WRITER</a>&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<a href="writer.htm" onMouseOver="showLayer('')">WRITER</a>
      <div id="Event" onMouseOver="showLayer('Event')" onmouseout="hideLayer('Event');">
        <a href="http://www.google.com">GOOGLE</a><br />
        <a href="http://kerbs.org/test/">Test</a>
      </div>
      <div id="Hdgeneral"  onMouseOver="showLayer('Hdgeneral')" onmouseout="hideLayer('Hdgeneral');">
        <a href="http://www.w3c.org">W3C</a><br />
        Dette er ikke et link
      </div>
      </div>
    </td>
  </tr>

Hvordan boksen skal se ud kan du ændre oppe i stylesheeten:
#menu DIV {position:absolute;top:12px;display:none;color:#000;padding-top:3px;width:100px;border:1px solid #000;background-color:#fff}
#Event      { left: 3px; } /* Bestemmer hvor langt til venstre Event er */
#Hdgeneral  { left: 90px;} /* Bestemmer hvor langt til venstre Hdgeneral er*/

Hvis du vil have flere menubokse skal du derfor lave en div med en bestemt id og placere den det samme sted som de andre bokse - og så fortæller du stylesheetet hvor langt til venstre den skal være.

I linien #menu DIV vælger du hvordan boksen skal se ud - du kan fx ændre lidt på hvor bred de skal være (evt. kan det være en fordel at ændre det for hver enkelt menuboks.
Avatar billede skovenborg Nybegynder
21. januar 2004 - 14:12 #11
det var måske nok en ordentlig mundfuld tekst - men jeg håber du forstår ideen bag.

Smider lige et svar mens jeg nu er i gang.
Avatar billede kerbs Novice
22. januar 2004 - 11:04 #12
Jeg har forstået det hele :) Du skriver jo så man forstår det - og tak for det ;)

En sidste ting..
Du har svaretp å hvordan jeg kunne ændre udseendet på menuen.. men hvis jeg godt vil ha der kommer en HVID baggrund, med en sort kant, når jeg kører over menuerne, hvordan fixes det? :)
Avatar billede skovenborg Nybegynder
22. januar 2004 - 16:12 #13
øhm, det burde den sidste gerne gøre - altså med:
border:1px solid #000;background-color:#fff

Det er i hvert fald sådan den vises på min computer ;-)
Avatar billede skovenborg Nybegynder
14. februar 2004 - 16:28 #14
kerbs >> Fik du det til at virke nu ?-)
Avatar billede kerbs Novice
15. februar 2004 - 16:45 #15
Hov hov.. havde helt glemt topic'et efter jeg fik det til at virke.

Men værsgo, og tak for hjælpen ;)
Avatar billede skovenborg Nybegynder
15. februar 2004 - 17:28 #16
helt i orden - og tak for point :-)
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