Skrift billede

det ville blive en meget lang forklaring, så jeg vil nøjes med at opfordre dig til at gemme web-siden på din maskine, og så gnave dig gemmen koden. Du kan også bare højreklikke på et tomt sted på siden og trykke view source/vis kilde.

Spørg direkte til Jumper. Det er vist ham der har lavet den.

Se hans svar på:
http://www.eksperten.dk/spm.asp?id=3810

mfriis, menuen på http://www.aakjaers.dk er egentlig ret simpel.

Ved onMouseover skifter jeg billede og opdaterer en variabel der holder øje med hvilken menu der er åben. Selve billedet er et imagemap, med links til en Javascript funktion og et tal. Javascript funktionen tjekker hvilken menu der er åben og hvilket link man har trykket på, og henter linket fra et array.

Hvis det ikke er forklaring nok og du meget gerne vil have en lignende menu, kan jeg da også godt klare det. Så koster det dog penge ;)

For et eksempel på en anden menu jeg har lavet: http://www.vojens.dk - menuen i højre side, når man er kommet forbi hovedsiden. Nem at konfigurere og ændre i menupunkterne, og meget hurtig.

/Thor

Hvis du har nogen forstand på javascript og onmouseover/-out er det ikke særlig svært... og ikke mindst image-map

Laver x antal billeder:
<IMG ID="billedmenu" SRC="billedover0.gif" onmouseover="KillOut()" onmouseout="StartOut()">
<IMG ID="billed1" SRC="billed1.gif" OnMouseOver="BilOver(1)" OnMouseOut="StartOut()">
<IMG ID="billed2" SRC="billed2.gif" OnMouseOver="BilOver(2)" OnMouseOut="StartOut()">
osv ...

og list java script:
<SCRIPT Language="JavaScript">
var TimeID;
function BilOver(nr)
{
  document.images["billedmenu"].src = "billedover"+nr+".gif";
}
function StartOut()
{
  TimeID = setTimeout("BilOver(0)", 5000);
}
function KillOut()
{
  clearTimeout(TimeID);
}
</SCRIPT>

Når du så kører musen hen over billed1, billed2 osv ændres billedmenu, hvis du så kaver et image-map på billedmenu er det hele klaret - og så selvfølgelig lidt design

Michael

PS imagemap:
<IMG id="billedmenu" ... usemap="#menu">
...
<MAP NAME="menu">
<area href="link.html" shape=rect coords="0,0,100,20">
<!-- Ovenstående for at lave en rektangel fra 0,0 til 100,20 (x,y-koordinater) som er et link til link.html -->
</MAP>

michaelras, du skal jo også holde styr på hvilken menu der er åben.

Hvis dit imagemap henviser til "link.html", vil den jo gøre det uanset hvilken menu der er åben.

/Thor

Ved jeg... Det var også bare lige det simpleste.... man kunne selvfølgelig bare lave en java script:link(nr) som testede om det rigtige billed var vist... personligt ville jeg lave det med alm. text og så bruge layer/span/div og dermed slippe for det store billed, men det er selvfølgelig min mening... hader onmouseover billeder....

ex på menu åben index:
<area href="java script:link(0,1)" shape=rect coords="0,0,100,20">
<area href="java script:link(1,1)" shape=rect coords="0,0,100,20">

<SCRIPT Language="JavaScript">
var TimeID;
var CurMenu = 0;
var links = new Array();
links[0] = "link1.html";
links[1] = "link2.html";
function BilOver(nr)
{
  document.images["billedmenu"].src = "billedover"+nr+".gif";
  CurMenu = nr;
}
function StartOut()
{
  TimeID = setTimeout("BilOver(0)", 5000);
}
function KillOut()
{
  clearTimeout(TimeID);
}

function link(nr,menu)
{
  if (CurMenu == menu) {location.href = links[nr];}
}
</SCRIPT>

hvor i link(nr, menu) nr = nummer i array, og menu = menu-id'et

Michael

Ok burde nok være:
<area href="java script:link(0,1)" shape=rect coords="0,0,100,20">
<area href="java script:link(1,1)" shape=rect coords="0,21,100,40">

bare for eksemplets skyld.... så'n at de ikke ligger oven i hinanden

Michael

ex med menu indexet skal selvfølgelig kædes sammen med det første eksempel jeg gav (lidt indforstået...)

Michael

Pointen med menuen på www.akjaers.dk er netop at den IKKE skulle benytte sig af DHTML, hvilket den heller ikke gør.

Derfor virker den også fra Netscape 3.

/Thor

Med ovenstående eksempel kan man dog ikke have et area til at ligge oven på et andet.... lidt en ulempe... med et par små ændringer er det ikke så svært, bare lave en 2-dimensionel array, hvor fx 1. dimension er menu-indexet, og andet er nummeret i rækken af billeder fx:
links[1][0] = "menu 1 link 0.html";
links[1][1] = "menu 1 link 1.html";
links[2][0] = "menu 2 link 0.html";
osv...

og så kun have én parameter på link så
function link(nr)
{
  if (CurMenu != 0) {
    if (!links[CurMenu][nr] != "") {locate.href = links[CurMenu][nr];}
  }
}

Ved ikke om man bare kan skrive (!links[CurMenu][nr] != "") for at teste om det er en tom streng, men det er det der er meningen med linien (for at man ikke hopper til / som nogle browsere erstatter href="" med)

Michael

PS. hmm begynder at virke lidt uoverskueligt med alle de kommentarer jeg snart har skrevet og skal sættes sammen... ;)

Jumper: det ved jeg... men jeg sagde også PERSONLIGT.... det var ikke nødvendigvis ment som en opfordring... og så vidt jeg ved virker ovenstående da også i NN3

Michael