WN - Två bilder på varandra

WN (https://www.wn.se/forum/index.php)

- Klientsidans teknologier, design och grafik (https://www.wn.se/forum/forumdisplay.php?f=12)

- - Två bilder på varandra (https://www.wn.se/forum/showthread.php?t=1040476)

Peter_Holm

2010-02-11 21:58

Två bilder på varandra

Nu behöver jag lite hjälp...

1. Jag har en karta i jpg-format.
2. Ovanför den kartan vill jag lägga en transparent png-bild med "p-platsskyltar".
3. Bilderna är lika stora, dvs 504x500pix.

Jag har testat med ett antal olika varianter. Men jag förstår inte hur jag ska få till det.

Finns det någon som har några smarta tips.

Viktor

2010-02-11 22:01

En fuling är att göra en tabell med samma storlek, lägg kartan som bakgrund och skyltarna som bild i tabellen.

Finns förmodligen snyggare lösningar dock =)

Peter_Holm

2010-02-11 22:04

Citat:

Ursprungligen postat av Viktor (Inlägg 20342427)

En fuling är att göra en tabell med samma storlek, lägg kartan som bakgrund och skyltarna som bild i tabellen.

Finns förmodligen snyggare lösningar dock =)

MM... men tabellbakgrunder... fan jag får klåda av sånt.. validerar väl inte ens!

MRosenson

2010-02-11 22:12

Gör samma sak som han sa då, fast med divar?

Edit, läste dåligt, men ex:
<div style="JPG bilden som bakgrund">
<img src="PNG bilden">
</div>

Om du ändå inte får till de kan du slänga iväg ett PM så ska ja hjälpa dig.

Cosma

2010-02-11 23:31

Prova använd en Div med kartan i som har position: relative med fasta mått och sedan nåt sånt här:

Kod:



div#parking-lot {

      position: absolut;

      top: 0;

      left: 0;

      width:150px;

      height: 200px;

     background: url(image);

}

Annars har du CSS3 och leka med.
http://www.webdesignerdepot.com/2009...can-use-today/

StefanBergfeldt

2010-02-12 08:40

Vad ni krånglar till det!

<img src="skyltar.png" style="background-image: url(karta.jpg);" />

Peter_Holm

2010-02-12 11:00

Citat:

Ursprungligen postat av StefanBergfeldt (Inlägg 20342452)

Vad ni krånglar till det!

<img src="skyltar.png" style="background-image: url(karta.jpg);" />

Helt Genialt! Haha!.... så löjligt lätt! Tack!

Tack också alla andra för försök. Men ska man lägga på fler lager än ett så kan en div-lösning ändå vara bra, men just nu tror jag inte det behövs!

Alla tider är GMT +2. Klockan är nu 16:16.