Makale numarası: 177378 - Son Gözden Geçirme: 02 Mayıs 2012 Çarşamba - Gözden geçirme: 1.0

BİLGİ: z-index özniteliği için html öğelerini nasıl çalışır.

Sistem İpucuBu makale, kullandığınızdan farklı bir işletim sistemine yöneliktir. Sizinle ilgili olmayabilecek makale içeriği devre dışı bırakıldı.

Bu Sayfada

Hepsini aç | Hepsini kapa

Özet

Web sayfası üzerindeki öğeleri gruplandırmak için birçok yöntem vardır. Bu makale ve z-index özniteliği amacıyla biz bunları iki kategoride bölebilirsiniz: pencereli ve penceresiz.

Pencere öğeleri

  • <OBJECT>Etiket öğelerinin</OBJECT>
  • ActiveX denetimleri
  • Eklentiler
  • Dinamik html (dhtml) kod parçacıkları
  • Öğeleri seçin
  • Internet Explorer 5.01 ve daha önceki sürümlerde IFRAMES
Not ActiveX denetimleri, penceresiz olarak uygulanır ve gerçekten penceresiz kategoridedir. Varsayılan olarak, Microsoft Visual Basic ve Microsoft Foundation Class (mfc) denetimleri pencereli, ancak etkin Şablon Kütüphanesi (atl) denetimleri penceresiz.

Penceresiz öğeleri

  • Penceresiz ActiveX denetimleri
  • Internet Explorer 5.5 ve sonraki IFRAMES
  • Köprüler veya tablolar gibi birçok dhtml öğeleri

Daha fazla bilgi

Kendi kapsayıcısının Dilekleri rağmen tüm penceresiz öğeleri üstünde tüm pencere öğeleri kendilerini boyayın. Penceresiz öğeleri açısından birbirlerine z-index özniteliği yalnızca izleyin ancak pencere öğeleri açısından birbirlerine, z-index özniteliği izleyin.

Penceresiz tüm öğeleri aynı mshtml düzleme işlenir ve pencere öğeleri ayrı mshtml düzlem üzerinde çizin. Z-index , öğeleri aynı düzlem üzerinde işlemek için ancak değil karıştırmak ve farklı öğeleri ile eşleştirmek için kullanabilirsiniz. Z-dizin her düzlemin öğeleri yeniden düzenleyebilirsiniz, ancak pencereli düzlem penceresiz düzlem üstündeki her zaman çizer.

Internet Explorer 5 z-index nasıl çalışır?

Internet Explorer 5 IFRAMES pencereli denetimler ve z-index niteliği açısından diğer öğeleri SEÇMEK gibi pencereli denetimler izleyin. IFRAME z-indexseçin öğelerini büyükse, IFRAME öğeleri seçin üstünde ve çizer. Z-index aynıysa, sayfadaki öğelerin sırasını önceliklidir; Bu nedenle, son öğenin önceki öğenin üstüne çizer.

Aşağıdaki örnek kod bunu göstermektedir:
<HTML>
<HEAD>
<TITLE>Z-Index</TITLE>
<script>
function setindex()
{
	div1.style.zIndex=text1.value;
	select1.style.zIndex=text2.value;
	getindexes();
}

function getindexes(){

	text1.value=div1.style.zIndex;
	text2.value=select1.style.zIndex;
	text3.value=5;
}
</script>
</HEAD>
<BODY onload="getindexes()">

Div
<input type="text" value="" id=text1 name=text1 ><p>

Select
<input type="text" value="" id=text2 name=text2><p>

IFrame
<input type="text" value="" id=text3 name=text3><p>
<input type="button" value="Set Z-Index" id=button1 name=button1 onclick="setindex()">
<DIV id=div1 name=div1  style="width:200;height:200;background-color:lightblue;
position:absolute;left:350;top:250;z-index:">DIV</DIV>
<select id=select1 name=select1 style=";position:absolute;left:300;top:400;width=300;z-index:" 
size=1 >
	<option>Option1
	<option>Option2
	<option>Option3
</select>
<IFRAME id=iframe1 name=iframe1 src="" scroll=none style="width:100;height:115;position:absolute;
left:400;top:300;border-color:green;z-index:5"></iframe>
</BODY>
</HTML>
				
IFRAME z-index 5 sabit bir değere ayarlanır. Öğeleri geri kalanı yüksek bir değer girdiğinizde, DIV öğesi penceresiz olduğu ve diğer öğeleri DIV öğesi üzerine çizmek için her zaman altta çizer. 5'ten büyük bir değer seçin öğesinin z-index değiştirdiğinizde seçin öğelerini IFRAME üzerine çizer. 5'ten az olan bir değer seçin öğesinin z-index değiştirdiğinizde, IFRAME altta çizer.

5'e seçin öğesinin z-index ayarladığınızda, IFRAME IFRAME son öğesi olduğu ve bu nedenle üzerinden seçinönceliği alır çünkü seçin öğesinin üzerine çizer. IFRAME öğesi seçin ve ardından, z dizinler aynı olduğunda öğesi IFRAME üzerine çizer.

z-index, Internet Explorer 5.5 nasıl çalışır?

Z dizin içinde hangi IFRAMES artık pencere öğeleri, Internet Explorer 5.5 tamamen yeni bir düzeye alınır. Daha fazla bilgi için aşağıdaki Microsoft Developer Network (msdn) makalesinde "Penceresiz IFRAME öğeleri" konusuna bakın:
#WindowlessFrames http://msdn.microsoft.com/en-us/library/ms649493 (v=vs.85) .aspx (http://msdn.microsoft.com/en-us/library/ms649493(v=vs.85).aspx#WindowlessFrames)
Bu pencere yalnızca öğe olarak seçin öğesini bırakır. Yukarıdaki kod seçin öğesinin z-index 5'ten daha büyük bir değere ayarladığınızda, sayfayı Internet Explorer 5. 5 ' çalıştırmak için kullanırsanız, IFRAME üzerine çizer. Z-indexseçin 5'ten az bir değere ayarladığınızda, IFRAME penceresiz öğelerinin her ikisi de olsa, çakışıyor. IFRAME benzersiz yapan budur: z-index penceresiz öğeleri açısından izler ve bu durumda z-index açısından pencere öğeleri Seç öğesi gibi destekler.

Z-indexDIV IFRAME (6 gibi) daha büyük bir değere ayarladığınızda, DIV IFRAME kapsar. Bu, yukarıdaki deyimi IFRAMES penceresiz ve geldikleri z-sırası açısından penceresiz diğer öğeleri destekler. Z-index IFRAME (5) eşit veya daha küçük bir değere ayarladığınızda, öğelerin sırasını öncelikli olduğundan hala üstünde DIV çizer. 6 DIVz dizini ayarlayın ve z-index öğesini seçin ve IFRAME 5 bırakın, pencereli olduğundan seçin öğe her zaman üstünde DIV çizer.

Ancak, son sırada olduğundan seçin üzerine çizmek IFRAME çalışır. Bunu önlemek için z-indexseçin öğesinin değerini IFRAME büyük olmalıdır veya Seç öğesinin z dizinler aynı olduğunda öğe her zaman üstünde IFRAME çizer sağlamak için listede son. Bu nedenle, z dizin benzer içerik zor olabilir. Bu sorunu gidermek için aşağıdaki yöntemleri kullanın:
  • Basamaklı stil sayfaları (css) Stil özniteliği gizlemek ve gerektiğinde öğeleri göstermek için kullanın.
  • dhtml kod parçacıkları kullanın. Genellikle tercih edilen davranışları olmasına rağmen bu kod parçacıkları tercih olduğu bir örneğidir.
  • Internet Explorer 5.5, zengin içerik her şeyi üstünde görüntülemenizi sağlar açılan nesne kullanabilirsiniz. Menüler ve araç ipucu işlevselliği için çok yararlıdır. Daha fazla bilgi için aşağıdaki msdn Web sitesinde "açılan nesne" makalesine bakın:
    http://msdn.microsoft.com/en-us/library/ms535882 (v=vs.85) .aspx (http://msdn.microsoft.com/en-us/library/ms535882(v=vs.85).aspx)
  • Pencereli nesneler yerine penceresiz ActiveX denetimlerini kullanın. Ne yazık ki, tüm ActiveX denetimlerini penceresiz uygulamaları gerekmez.

Referanslar

Microsoft Internet Explorer için Web tabanlı çözümler geliştirme hakkında daha fazla bilgi için aşağıdaki Microsoft Web sitelerini ziyaret edin:
http://msdn.microsoft.com/ie/ (http://msdn.microsoft.com/ie/)

http://support.microsoft.com/iep (http://support.microsoft.com/iep)
Anahtar Kelimeler: 
kbbug kbdhtml kbfaq kbieobj kbinfo kbmt KB177378 KbMttr
Otomatik TercümeOtomatik Tercüme
ÖNEMLİ: Bu makale, bir kişi tarafından çevrilmek yerine, Microsoft makine-çevirisi yazılımı ile çevrilmiştir. Microsoft size hem kişiler tarafından çevrilmiş, hem de makine-çevrisi ile çevrilmiş makaleler sunar. Böylelikle, bilgi bankamızdaki tüm makalelere, kendi dilinizde ulaşmış olursunuz. Bununla birlikte, makine tarafından çevrilmiş makaleler mükemmel değildir. Bir yabancının sizin dilinizde konuşurken yapabileceği hatalar gibi, makale; kelime dağarcığı, söz dizim kuralları veya dil bilgisi açısından yanlışlar içerebilir. Microsoft, içeriğin yanlış çevrimi veya onun müşteri tarafından kullanımından doğan; kusur, hata veya zarardan sorumlu değildir. Microsoft ayrıca makine çevirisi yazılımını sıkça güncellemektedir.
Makalenin İngilizcesi aşağıdaki gibidir:177378  (http://support.microsoft.com/kb/177378/en-us/ )
Retired KB ArticleKullanım Dışı Bilgi Bankası İçeriği Yasal Uyarı
Bu makale, Microsoft'un artık destek sağlamadığı ürünler ile ilgili olarak yazılmıştır. Bu nedenle, bu makale "olduğu gibi" sağlanmıştır ve bundan sonra güncelleştirilmeyecektir.