---
title: "Image-map"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/71166-image-map"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "kbking"
published: "2003-03-15T14:04:43.000Z"
updated: "2003-03-15T17:44:09.000Z"
replies: 8
views: 240
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/71166-image-map"
---

# Image-map

## #1 — kbking, 2003-03-15T14:04Z

Mellan head taggarna har jag: 

\<script src="script/kbking.js"\>\</script\> och i body har jag:

\<a href="#" onClick="openNewWin();return false;"\>\<img src="images/kbking.gif" width="13" height="75" border="0"\>\</a\>

Koden skriver ut ett pop-up fönster med diverse info. Detta fungerar alltså utmärkt.

Nu har jag emellertid en bild som med ett flödes-schema symboliserar organisationen. Jag vill göra en image-map av denna bild och ha sju ställen på den klickbara för att få upp likadan info som jag kan med ovanstående metod. 

Det jag undrar är:  Hur skriver jag länken för vart och ett av dessa sju ställen?

(jag använder Dreamweaver)

Permalänk: https://www.webforum.nu/p/71166

## #2 — dectgap, 2003-03-15T14:32Z

Titta lite på hur koden ser ut här så förstår du nog hur du ska göra:

<http://roslund.homeip.net/mattias/imagemap/index.html>

Säga vad man vill om WYSIWYG-redigerare, men de är oslagbara när man ska göra imagemaps.

Permalänk: https://www.webforum.nu/p/978340

## #3 — kbking, 2003-03-15T16:02Z

Ursäkta att det tog en stund för mig att fatta!

Detta använde jag:

\<map name="Map"\>
\<area shape="rect" coords="27,60,209,99" onclick="openNewWin();return false;"\>
\</map\>

När jag nu skall göra ytterligare 6 länkar i denna image-map, vad behöver jag ändra på då? Är det mer än att numrera fönstren från 1-6? Jag kan väl lägga alla i samma .js fil också, eller hur?

Permalänk: https://www.webforum.nu/p/978384

## #4 — Peter S, 2003-03-15T16:11Z

Genom att omdefiniera din *openWin()*\-funktion kan du göra det hela lite smidigare:

```
// I .js-filen

function openWin( url ){
     window.open( url, "", "height=300,width=300" );
};

// I <body>

<map>
<area onclick="openWin('sida1.html')"....
<area onclick="openWin('sida2.html')"....
</map>
```

 :)

Permalänk: https://www.webforum.nu/p/978390

## #5 — kbking, 2003-03-15T16:17Z

jag har denna kod, går den att anpassa? Tänkte närmast på "user id"

\<script\>
			var fonster;
			function openwin(id) {
				fonster = window.open("http://www.jcd.se/applikationer/bjerking/personal/view/card.asp?user="+id,"fonster","WIDTH=600,HEIGHT=370");
				//fonster.window.moveTo(screen.availWidth-420,10);
				fonster.focus();
			}
		\</script\>

Koden ingår inte i mina sidor - jag använder inte asp - men tänkte att den kanske går att skrynkla till på något vis

Permalänk: https://www.webforum.nu/p/981369

## #6 — dectgap, 2003-03-15T16:32Z

```
<html>
<head>
<script type="text/javascript"> 
var fonster; 
function openwin(id) { 
fonster = window.open("http://www.jcd.se/applikationer/bjerking/personal/view/card.asp?user="+id,"fonster","WIDTH=600,HEIGHT=370"); 
//fonster.window.moveTo(screen.availWidth-420,10); 
fonster.focus(); 
} 
</script> 
</head>

<body>
<img src="din_bild" usemap="#ett_namn" />
<map name="ett_namn">
 <area onclick="openwin(1)" ... />
 <area onclick="openwin(2)" ... />
 <area onclick="openwin(3)" ... />
 <area onclick="openwin(4)" ... />
</map>
</body>
</html>
```

Permalänk: https://www.webforum.nu/p/981378

## #7 — kbking, 2003-03-15T17:05Z

Tack!

Allt väl så här långt. När jag klickar i "image-mappen" så visas ingen hand. Går det att få med den också?

Permalänk: https://www.webforum.nu/p/981388

## #8 — dectgap, 2003-03-15T17:30Z

Enklast är att lägga till följande i dina area-taggar: href="#"

Permalänk: https://www.webforum.nu/p/981397

## #9 — kbking, 2003-03-15T17:44Z

Tack båda två för denna gång!

Permalänk: https://www.webforum.nu/p/981407

---

Tråden på webben: https://www.webforum.nu/amne/javascript/71166-image-map
