videreklik duer ikke i IExplorer

Linket ligger under bunden af siden, der kan man klikke..

Prøv at sætte en rød border omkring linket, så kan du bedre se hvad der sker.

Vh.

Det er sådanne problemer, der let opstår, når man bygger designet op på den måde. Jeg tror, du kunne spare rigtig meget tid næste gang ved at lave designet ud af de forskellige elementer i stedet for så store billeder og <map>- og <area>-tags.

jeg har faktisk endnu før jeg valgte den omtalte metode, siddet og fidlet på http://www.define-art.dk/living_through/index.php med en masse divtags, hvori jeg har puttede hvert enkelt lille thumbnail, og det er vildt tidskrævene. Og jg troede netop at jeg med den aktuelle metode ville undgå alt dette hyr..

Men hvorfor overhovedet putte dem i div-tags? Hvorfor ikke bare sætte dem op ved siden af hinanden som ganske almindelige billeder?

<img src="billed1.jpg">
<img src="billed2.jpg">
<img src="billed3.jpg">
<img src="billed4.jpg">
<img src="billed5.jpg">

Mellemrummet imellem dem kan du jo fikse med en style="margin-right:15px" på alle billederne.

På samme måde virker det også lidt voldsomt at have p-tags uden om alle dine links i menuen.

Det kunne let løses med <br> i stedet, eller som mange gør i dag: med <ul>- og <li>-tags, som er meget bedre at bruge til det. (Hvert link er jo ikke et afsnit og skulle nødigt forståes som et sådan.)

En menu med ul kunne se sådan ud:

<ul id="menu">
  <li>
    <a>Link</a>
  </li>
  <li>
    <a>Link</a>
  </li>
  <li>
    <a>Link</a>
  </li>
</ul>

Så skal du bare med CSS fjerne prikkerne, der kommer foran hvert link, ved at sætte list-style-type:none; på #menu.

Hele denne samling meta-tags er i øvrigt også forældede og bruges ikke til noget mere, så dem kan du ligeså godt spare væk:

<META NAME="DC.Title" CONTENT="DEFINE ART Josefine Blom">
<META NAME="DC.Description" CONTENT="illustrationer af Josefine Blom">
<META NAME="DC.Subject" CONTENT="bogillustrationer, ">
<META NAME="DC.Creator" CONTENT="Josefine Blom josefine_blom@hotmail.com">
<META NAME="DC.Contributor" CONTENT="Josefine Blom josefine_blom@hotmail.com yes-yes.dk">
<META NAME="DC.Rights" CONTENT="Josefine Blom josefine_blom@hotmail.com">
<META NAME="DC.Language" scheme="NISOZ39.50" CONTENT="dan">
<META NAME="DC.Type" CONTENT="Image.Graphic">
<META NAME="DC.Format" SCHEME="MIME" CONTENT="image/jpeg">
<LINK REL="schema.dc" HREF="http://purl.org/metadata/dublin_core_elements">

Og i stedet for at skrive alle dine stier sådan her:

http://www.define-art.dk/define-art.php

bør du skrive:

/define-art.php

Når du bruger http:// tror den, at den skal ind på et andet domæne - derfor vil den loade længere tid.
Ved at indlede stien med / derimod, ved browseren, at stien skal starte i roden af domænet.

Ang. p-tags'ene i menuen er især denne konstruktion ikke så heldig, bl.a. mht. til søgemaskiner:

<p>&nbsp;</p>

Som du kan se, kan du faktisk få din kode til at blive virkelig kort med disse rettelser. En lidt anden opbygning af sidens struktur vil spare endnu mere kode.

Din CSS kan også blive enormt meget kortere - og lige nu har du et CSS-dokument for hver side, hvilket også er stort overkill. Du kan sagtens nøjes med ét dokument til alle sider, og sådan udnytter du også bedst det, som CSS kan.

(Dette var sidste rettelse, det lover jeg. =)

jeg er jo netop også gået over til at lave hotspots på et billede i stedet for at at fidle div-tags!
jeg skrev et svar, der desværre må være forsvundet. Måske fordi vi har svaret samtidigt?? Kommer så herind nu og opdager at du har skrevet masse af svar. I mellemtiden fik jeg altså rettet problemet vhja 1px border, så jeg kunne (gentager tabt besked) lægge en map med padding, der direkte fortæller hvor illustrationen ligger.

Næste gang det bliver aktuelt og jeg har tid, vil jeg afprøve w13's metode.

Hvem  vil have points?

;o)

Ingen points til mig, tak. =)

Hotspots kan være gode nok i nogle tilfælde, men det bliver også hurtig en rodet løsning. Især hvis man kan løse problemet anderledes. (I dette tilfælde blot med:

<a style="margin-right:15px" href=""><img src="billed1.jpg"></a>
<a style="margin-right:15px" href=""><img src="billed2.jpg"></a>
<a style="margin-right:15px" href=""><img src="billed3.jpg"></a>
<a style="margin-right:15px" href=""><img src="billed4.jpg"></a>
<a style="margin-right:15px" href=""><img src="billed5.jpg"></a>

Det vil være meget enklere og så undgår man netop de problemer, du oplever nu. Det kan også sagtens laves med div-tags, men så skal man bare lige have lidt mere CSS med.)

Men når det virker nu, så er det jo helt fint.

Næste gang vil du dog spare rigtig meget tid ved at lave det som beskrevet. =)

Var der ingen der skal have points?
B-o

Vi ka' vel dele så. =)