Hvad bruges map elementet til?
HTML-elementet map kan bruges til at oprette et kort over et websted. Det er et af de mest almindelige html-elementer og bruges til at definere et område eller et område som et link. Det kan bruges til at tilføje et kort til et websted eller et billede, som brugeren kan interagere med. Et map-element har et unikt id, som det bruger til at identificere det pågældende område og kan også indeholde flere områder inden for det samme kort.
Map-elementet har en række forskellige attributter, som det kan bruge til at definere et område. Disse attributter inkluderer coords, shape, alt og href. Coords er et array af koordinater, der definerer et område. Shape definerer formen på et område, og alt er et alternativ tekstbeskrivelse af området. Href er en link-adresse, som brugeren kan klikke på.
Map-elementet kan også bruges i kombination med et img-element for at oprette et interaktivt kort. Når et img-element kombineres med et map-element, kan det bruges til at definere områder på kortet, som brugeren kan klikke på. Når brugeren klikker på et område, kan de blive omdirigeret til en anden side eller et andet sted på webstedet.
Map-elementet er et meget nyttigt værktøj til oprettelse af interaktive kort og er et af de mest populære HTML-elementer. Det kan hjælpe med at gøre et websted mere brugervenligt og gøre det lettere for brugerne at navigere rundt på webstedet.
Eksempler på map
Eksempel 1:
<img src=”example.jpg” usemap=”#examplemap”>
<map name=”examplemap”>
<area shape=”rect” coords=”0,0,82,126″ href=”example1.html” alt=”Example 1″>
<area shape=”circle” coords=”90,58,3″ href=”example2.html” alt=”Example 2″>
<area shape=”poly” coords=”124,58,124,86,88,103,82,125″ href=”example3.html” alt=”Example 3″>
</map>
Dette eksempel bruger map-elementet til at oprette et klikbart område over et billede. Dette betyder, at når et bestemt område af billedet klikkes på, omdirigeres brugeren til en anden side.
Eksempel 2:
<map name=”examplemap”>
<area shape=”rect” coords=”0,0,82,126″ href=”example1.html” alt=”Example 1″>
<area shape=”circle” coords=”90,58,3″ href=”example2.html” alt=”Example 2″>
<area shape=”poly” coords=”124,58,124,86,88,103,82,125″ href=”example3.html” alt=”Example 3″>
</map>
Dette eksempel bruger map-elementet til at definere et klikbart område på et websted. Dette betyder, at når et bestemt område på webstedet klikkes på, omdirigeres brugeren til en anden side.
Eksempel 3:
<img src=”example.jpg” usemap=”#examplemap”>
<map name=”examplemap”>
<area shape=”rect” coords=”0,0,82,126″ href=”example1.html” alt=”Example 1″>
<area shape=”circle” coords=”90,58,3″ href=”example2.html” alt=”Example 2″>
<area shape=”poly” coords=”124,58,124,86,88,103,82,125″ href=”javascript:alert(‘Example 3’);” alt=”Example 3″>
</map>
Dette eksempel bruger map-elementet til at definere et klikbart område på et billede. Dette betyder, at når et bestemt område af billedet klikkes på, udføres en JavaScript-funktion, f.eks. en pop op-besked.