[oxigen]

şuanda üstüne çalıştığım bi projenin ana sayfa menüsünde (resim 1), OVER resimler (resim 2) kullanmam gerekli. bunlar sonradan girdi işin içine, önceden konuştuğumuzda yoktu ve tasarımıda buna göre ayarladım. şimdi bunları div ile yapayım diyorum, ama her resim için 2 ayrı div kullanmam gerekli sanırım (normal / over), peki bunları JavaScript ile nasıl gizler ve gösteririm ?

menu ;


over ;


yada başka bi yolu varmı?

[metadige]

Arkadaşım en basit haliyle kullandığım şöyle bir fonksiyon yazdım:

function katman(id){
var x=document.getElementById(id).style;
if(x.display=='none'){
x.display='block';
}
else{
x.display='none';
}
}

kullanacağın zaman:

<div id="katman1" onmouseover="goster('katman2')" onmouseout="goster('katman2')"></div>

gibi veya uygun şekilde kullan.

[oxigen]

cevabın için teşekkür ederim dostum, ama forumda arama yaptığımda gözümden kaçırdığım bir başka kodu kullandım...

Show Layer Hide Layer burda bulunan kodu değiştirdim (aslında tam değiştirdim denilemez) ve benim işime yaradı şimdilik.
tekrar teşekkür ederim....

[oxigen]

yaa arkadaşalr bu DIVler çok sorun oldu bana , şimdide pencere boyutu değiştiğinde kayma yapıyor. acaba benim bilmediğim (daha doğrusu öğrenemediğim) bir komut yada ona benzer anahtarlarmı var yaa, sorun kesin bende ama neyse

(ben 1152*864 px. çözünürlükte çalışıyorum, daha küçük / büyük çözünürlükte kayma yapıyor)

[omerbalyali]

Her zaman söylemişimdir, XHTML ve HTML sizin için pek önemli olmayan, çok fazla laubali olmayacağınız fakat sunum kısmını bitirnce uğraşacağınız tek şey olan kısımdır bir sitede.

Şöyle ki; CSS'i iyice bilen, neyi nerede ve nasıl kullanacağını az çok tecrübe edinmiş birisinin kodladığı XHTML çok sade ve çok kolay anlaşılır olur. Baktığınızda kodların -eski tablolu ve csssiz durumuna nazaran- %70'inden fazlası asıl sitenin içerik kısmı geri kalanı xhtml etiketleridir.

CSS'i iyi öğrenirsen kaymada olmaz, bir çok şeyi de yaparsın. Tek tavsiyem W3SCHOOLS. Ben oradan öğrendim CSS'i komple, daha önceden bazı ufak bilgilerim de vardı. Ve devamında bolca örnek yap, bir şeyi yapamayınca "nasıl yapılır bu" diye sormak yerine araştır, ama sorunu "anladığın gibi" değil, "sorunu yazarak, sorunlu kodları parça parça yazarak" araştır. Bunun yararı sormadığın için direk cevabı almazsın ve araştırırsın. Araştırırken başka bir çok şeyi öğrenirsin.

Mesela "position:absolute" sorun yapıyor, sen "pozisyon sorunu" diye ararsan hiç alakasız şeyler çıkabilir. ama "CSS positin absolute" diye ararsan veya bunun sonuna problem/question/hint gibi kelimeleri eklersen bir çok sonuç alabilirsin, öğrenirsin bu işi.

Kolay gelsin.

[metadige]

Arkadaşım ömerin de söylediği gibi posizyonu yanlış belirtmenden kaynaklanır, absolute, relative ve static farkını bilmen lazım.Eğer işin aceleyse şu an z-index ile de halledebilirsin. Şöyleki önce görünecek layeri istediğin yere yerleştir.

position:absolute;
z-index:1; <----- sayfanın durumuna göre.

olarak ver.Sonradan açılacak katmanı da hemen altına aynı değerlerle yaz yalnız z-index olarak öncekinden bir fazlasını ver yani burada

z-index:2; olacak.

bu ikisini de yine position:absolute olan bir dive yerleştir.Yani:

<div style="position:absolute;">
1. div
2. div
</div>

[oxigen]

@omerbalyali, dostum aslında çok önemli bi noktaya değinmişsin, sormak yerine araştırmak gerçekten en iyisi. ama şuanda araştırmaya pek bi vaktim yoktu, çünkü bu olayı yeni farkettim ve acilen düzenlemem gerekliydi.

ikinizede çok teşekkür ederim.

[omerbalyali]

Biliyorum öyle olduğunu. Ben bu konu için değil, genel anlamda ve daha çok kişisel/deneysel projelerde böyle yapmanın iyi olacağını düşünüyorum, sonuçta müşterine "yapamadım ama araştırarak başka şeylerde öğreniyorum 1-2 hafta bekle" diyemezsin.

[oxigen]

tekrar teşekkürler

ayrıca biraz değişik yollardan da olsa, sorunu çözdüm

<div style="position: relative; z-index: 1; float:left" id="layer4">
	<a href="#" onmouseover="c4.style.display=(c4.style.display!='none')?'none':''">
	<img border="0" src="../assets/images/tr/cat_off_4.gif">
	</a>
	
<div id="c4" style="display:none; position: absolute; z-index: 2; left:0px; top:-46px" onmouseout="c4.style.display=(c4.style.display!='none')?'none':''">
	<a href="urunler.ASP?cid=4&dil=1"><img src="../assets/images/tr/cat_on_4.gif" border="0">
	</a>
	</div>

</div>