Jump to content
Sign in to follow this  
pgdx

Image map

Recommended Posts

Her er koden:

<div id="top">
<img src="img/blue.gif" alt="Pick a page" />
<map name="meny">
 <area shape="rect" coords="46,30,96,41" href="?q=main">
 <area shape="rect" coords="46,48,123,61" href="?q=ommeg">
 <area shape="rect" coords="46,66,124,80" href="?q=img">
 <area shape="rect" coords="46,84,130,98" href="?q=guestbook">
 <area shape="rect" coords="47,102,96,115" href="?q=links">
 <area shape="rect" coords="45,120,113,134" href="?q=contact">
</map>
</div>

#top {
float: left;
width: 378px;
height: 162px;
}

Det virker bare ikke. Jeg har testet samme koden utenfor div, og det funker, men det hjelper ikke meg mye...

 

Vet det er et par alternativer til image map, og jeg kommer nok til å bruke de istedenfor med tiden, men akkurat nå vil jeg at dette skal virke!

Edited by Toolshed

Share this post


Link to post

du har glemt usemap :p

en fordel at bildet vet at det skal bruke kartet vettu :)

 

<img src="img/blue.gif" alt="Pick a page" usemap="meny" />

 

div-en, og dens plassering, skal overhodet ikke påvirke innholdet - i dette tilfellet et bilde med imagemap.

Edited by enden

Share this post


Link to post

Image maps er teite, bedre å dele det opp i mindre bilder og gjøre det på "den vanlige" måten..

 

Eller med CSS, liste greier... slik som FuLu laga til meg på absentvoid.com... Trur eg har lært meg det litt bedre no...

Share this post


Link to post

Hvorfor er det bedre å dele opp bilder i mindre deler?

Blir de mindre i størrelse? Er det lettere å plassere mange små enn ett stort?

Mouseover er vel det eneste argumentet jeg ser. Opplys meg :)

Share this post


Link to post
Hvorfor er det bedre å dele opp bilder i mindre deler?

Blir de mindre i størrelse? Er det lettere å plassere mange små enn ett stort?

Mouseover er vel det eneste argumentet jeg ser. Opplys meg :)

Prinsipp. IMO så er Imagemap = rotekode :p

 

Rein kode er viktig, iallefall av og til. på nye ompatut.absentvoid.com har eg gitt blaffen i kode, nesten.. Er ikkje så rotete som PC's kode riktignok ;):evil:

Share this post


Link to post

Si meg, koder du for hånd? Hvis ikke skal du ikke snakke så høyt om rotekode, oh hvis du gjør det så vet du et imagemaps ikke er mer rotete enn andre ting. Du graver deg bare dypere her nå kjære ompa :p

Men vi dropper vidre diskusjon her nå :)

Share this post


Link to post
du har glemt usemap :p

en fordel at bildet vet at det skal bruke kartet vettu :)

Har prøvd med det også, men det virker fremdeles ikke.

 

Det er ett eller annet gale med den div-en... Det funker helt fin uten div. Med eller uten usemap...

Share this post


Link to post
Siden blir ikke validert hvis du ikke har en alt på slutten ihvertfall

Nei, akkurat. Men det er nok dessverre ikke svar på spørsmålet...

 

<div id="top">
<img src="img/blue.gif" alt="Pick a page" usemap="meny" />
<map name="meny">
 <area shape="rect" coords="46,30,96,41" href="?q=main">
 <area shape="rect" coords="46,48,123,61" href="?q=ommeg">
 <area shape="rect" coords="46,66,124,80" href="?q=img">
 <area shape="rect" coords="46,84,130,98" href="?q=guestbook">
 <area shape="rect" coords="47,102,96,115" href="?q=links">
 <area shape="rect" coords="45,120,113,134" href="?q=contact">
</map>


</div>

Share this post


Link to post
Bruk DENNE metoden i stedet ;)

Jeg fikk ikke helt til den, nei...

 

Har fulgt den til punkt og prikke, men skriften vil ikke skjules

#meny a i {
visibility: hidden;
}

Hva betyr det? a og i?

 

Og hvis jeg prøver å skjule selve linkene blir de selvsagt ikke "klikkbare", som han kalte det...

Share this post


Link to post

TROR feilen din ligger i href'en inne i area taggene. Saafremt du skal ha informasjonen til annet skript enn index fila di, vil det ikke fungere.

 

Hvis du skal ha det til fila test.php maa area taggen'e se ut som:

<area shape="rect" coords="46,30,96,41" href="test.php?q=main" />

 

#meny a i {

visibility: hidden;

}

betyr kun at innholdet i alle a og i tagger blir usynlig, i tillegg til alle sted hvor id=meny vil bli usynlige

 

Coq Rouge (Haaper det hjalp)

Share this post


Link to post
#meny a i {

visibility: hidden;

}

betyr kun at innholdet i alle a og i tagger blir usynlig, i tillegg til alle sted hvor id=meny vil bli usynlige

Tror ikke du har rett der! Når det ikke er komma mellom a og i gjelder noen spesielle regler i CSS for dette.

#meny a i virker kun inn på noe sånt som dette:

 

<span id="meny">
<a href="..."><i>Dette er det eneste som blir skjult! Fordi den er inne i et a element og så et i element med id 'meny'.</i></a></span>

 

Vil du skjule alle a'er og i'er i id'en meny, bruk #meny a, i{

 

 

edit: som satyrium sa. brukte litt lang tid på å skrive innlegget :)

Edited by lokaltog

Share this post


Link to post
Nei, det satyrium sa er rett. Uten komma så skjuler han alle I'er  innafor a'ene.

Er det noen som har sagt at det han sa er galt da?

 

edit:

 

Kom på hva om du gjør slik?

<div>
<img src="img/blue.gif" alt="Pick a page" usemap="meny"  id="top" />
<map name="meny">
<area shape="rect" coords="46,30,96,41" href="?q=main">
<area shape="rect" coords="46,48,123,61" href="?q=ommeg">
<area shape="rect" coords="46,66,124,80" href="?q=img">
<area shape="rect" coords="46,84,130,98" href="?q=guestbook">
<area shape="rect" coords="47,102,96,115" href="?q=links">
<area shape="rect" coords="45,120,113,134" href="?q=contact">
</map>
...
</div>

 

Det burde funke!

 

edit2:

hmmm.. Vet ikke om jeg leste spørsmålet riktig!

Edited by lokaltog

Share this post


Link to post
#meny a i { betyr at innholdet i <i>, innenfor <a> som er innenfor et element med igjen id="meny" som skjules.

Tusen takk for hjelpen. Et ganske snedig hack, så lenge man visst hvordan det fungerte... :)

 

Hadde selvsagt ikke fulgt manualen heeeelt til punkt og prikke, men bare utelatt <i> rundt linkene fordi jeg ikke trodde det hadde noe å si... :p

Share this post


Link to post

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
Sign in to follow this  

×
×
  • Create New...