ugrás a tartalomhoz

Kép helyezése térképre

makezdtem · 2011. Ápr. 12. (K), 20.45
Az miért van hogy rá akarok tenni egy másik kis képet a térképemre, ami menü lenne és ugye a rendezést absolute ra rakom, így egyből átbassza layerbe és felbassza a sarokba a képet miután elmentem!
Hogy csináljam meg hogy a kép ott legyen a másik képen ahova teszem!???
‹ Form submit cancel Hozzászólás saját oldalon tárolva ›
 ■
1

Hmm?

Blintux · 2011. Ápr. 12. (K), 22.40
Szerintem kevesen érik mi is a gondod pontosan, én sem vágom igazán.
Ha felteszel egy kérdést, próbáld meg úgy elolvasni mint egy külső szemlélő, aki abszolút nem tudja mit szeretnél csinálni. Ha megérted, akkor jó a kérdés, ha nem, akkor még csiszolj rajta :)

Én most arra tippelek, hogy CSS-el szeretnél egy képre, egy másik képet tenni, amit be akarsz pozicionálni egy bizonyos koordinátára.
Nos, ehhez kell két DIV. Egyik háttere a nagy kép és a pozíciója relative.
A kis kép DIV-je bent van a nagy kép DIV-jében és a pozíciója absolute.
A kis képet ezután a top, left, bottom, right opciókkal tudod ide-oda pozicionálni a nagy kép DIV-jében.
2

Igen

makezdtem · 2011. Ápr. 12. (K), 22.57
Igen kérem erre gondoltam!
De le tudnál nekem írni kódokba egy ilyet? Légy oly szíves! :)
3

Íme

Blintux · 2011. Ápr. 12. (K), 23.53
.nagy {
	position:relative;
	width:400px;
	height:300px;
	background-color:#ff0000;
}

.kicsi {
	position:absolute;
	width:30px;
	height:30px;
	top:80px;
	left:100px;
	background-color:#0000ff;
}
<div class="nagy">
	<div class="kicsi"></div>
</div>
Értelem szerűen a background-color helyet background-image-t használsz ha képet szeretnél háttérnek.
4

működik

makezdtem · 2011. Ápr. 13. (Sze), 17.46
Működik de mikor még egy másik képet is be akarok rakni a nagy képre azt már nem jeleníti meg miért?
Kell még valamit csinálni? :S
5

Részletezd

Poetro · 2011. Ápr. 13. (Sze), 18.15
Mit jelent, hogy nem jeleníti meg? Nem lehet hogy az egyik kép eltakarja a másikat, és ezért csak nem látszik? Vagy hibás elérési utat adsz meg a képre? Vagy nem is ott van a kép, ahol számítasz rá?
6

Példa

Blintux · 2011. Ápr. 13. (Sze), 18.24
A második képnek is kell egy azonosító. Ha ugyanazt adod neki, mint az elsőnek, akkor egymásra kerülnek.

Példa két kis képre:
.nagy {  
    position:relative;  
    width:400px;  
    height:300px;  
    background-color:#ff0000;  
}

.kicsi_1,
.kicsi_2 {
    position:absolute;  
    width:30px;  
    height:30px;  
}

.kicsi_1 {  
    top:80px;  
    left:100px;  
    background-color:#0000ff;  
}

.kicsi_2 {  
    top:140px;  
    left:180px;  
    background-color:#00ff00;  
}
<div class="nagy">  
    <div class="kicsi_1"></div>
    <div class="kicsi_2"></div>
</div>
Mint látod, a közös értékeket célszerű összevonni, ezzel is segítve a gyorsabb letöltést.
7

Nagyon szépen köszönöm!

makezdtem · 2011. Ápr. 13. (Sze), 19.55
Nagyon szépen köszönöm a segítséged!
Még azt szeretném megkérdezni, hogy ha én még beleakarok vinni egy olyat, hogy a két kis kép nagyobb legyen ha ráviszem az egeret!
Akkor azt hogy egészítsem ki?

Alapjáraton erre gondolok!
<a href="home.html"
	onmouseover="document.images[0].src='home2.gif';"
	onmouseout="document.images[0].src='home1.gif';">
	<image border="0" src="home1.gif">
</a>
Ezt kellene a másikkal egybe tenni!
Próbáltam átírni de ezután eltűnt a nagy képem és a kis képem amit eddig leírtál nekem és az új kép ami bejött a régi helyett felugrott a sarokba! :D
Remélem érthető :S
Köszönöm fáradozásotokat!
8

Link

Blintux · 2011. Ápr. 13. (Sze), 21.15
Ebben az esetben a legegyszerűbb megoldás ha az <a> tegeknek adsz háttérképet, ami rámutatáskor cserélődik.

Példa:
.nagy {
	position:relative;
	width:400px;
	height:300px;
	background-color:#ff0000;
}
	
a.kicsi_1 {
	display:block;
	position:absolute;
	width:30px;
	height:30px;
	top:80px;
	left:100px;
	background-color:#0000ff;
}

a.kicsi_1:hover {
	width:50px;
	height:50px;
	background-color:#0f0f0f;
}
<div class="nagy">
	<a href="#" class="kicsi_1"></a>
</div>
DIV-ekre is lehet alkalmazni a hover-t, de az IExplorerek régi verziói ezt nem szeretik.
9

értem

makezdtem · 2011. Ápr. 13. (Sze), 22.25
meglesem ezt a verziót holnap aztán írok ha nem értek valamit köszi szépen!