Abstract There are many ways to classify the elements on a web page. Based on the purpose and z-index properties of this article, we can divide them into two categories: window classes and non-window classes. Window elements • logo elements • ActiveX Controls • Plug-Ins • Dynamic HTML (DHTML) ScriptleTLETS • SELECT Elements • Internet Explorer 5.01 and IFRAMES in earlier versions Note that ActiveX control is implemented in accordance with the window class, but in fact, some are non-window classes. Default Microsoft Visual Basic and Microsoft Foundation Class (MFC) controls are window classes, but Active Template Library (ATL) space is non-window class. Non-window Elements • ActiveX controls for non-window • Internet Explorer 5.5 and later version of IFRAMES • Most DHTML elements, such as HyperLinks and Tables MORE INFORMATION All window class elements are overwritten on non-window elements, regardless of their containers. However, between window elements is also like The window class elements are all arranged in accordance with the Z-Index property.
All non-window elements are presented on the same MSHTML plane, while window elements are presented on separate MSHTML planes. You can use Z-Index to operate elements in the same plane, but don't bring unopened Elements are mixed. You can rearrange Z-Index on different planes, but the plane of the window class is always above the non-window classes. How to work in Internet Explorer 5, how to work in Internet Explorer 5, Iframes is a window-like control, and he is arranged together in the order of the Z-Index property and other window classes, such as a SELECT element. If the iframe's z-index value is larger than the SELECT element, then iframe will present it in the SELECT element. On, vice versa. If the z-index value is the same, you have to look at the location on the page; that is, the elements that are finally put on will be above the elements.
The following code description This point:
z-index </ title> <script> function setIndex () {div1.style.zindex = text1.value; select1.style.zindex = text2.Value GetIndexes ();</p>
<p>Function getIndexes () {</p>
<p>Text1.Value = div1.style.zindex; text2.value = select1.style.zindex; text3.value = 5;} </ script> </ head> <body οnlοad = "getIndexes ()"></p>
<p>Div <input type = "text" value = "" id = text1 name = text1> <p></p>
<p>Select <input type = "text" value = "" ID = text2 name = text2> <p></p>
<p>Iframe <input type = "value =" "ID = text3 name = text3> <p> <input type =" button "value =" set z-index "id = button1 name = button1 οnclick =" 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 = "" "" "" ",,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,,, 5 "> </ iframe> </ body> </ html> iframe Z-INDEX is set to a constant value 5. When you enter a value that is larger than any element, the DIV element is still at the bottom Because he is a non-window, other elements will be above the DIV element. When you set the Select element's Z-index value, the select element will be on the iFrame. When you put the SELECT element When the z-index value is 5 hours, it will be under IFRAME. When you set the Z-index value of the SELECT element to 5, iframe will be on the Select element, because iframe is the last element Therefore, it will be preferred than SELECT. If the select element is behind iframe, then it will be on the iFrame when the z-index value is the same. What is Z-Index in Internet Explorer 5.5 works in Internet In Explorer 5.5, Z-Index is brought to a new level. Iframes is no longer a window element. For more information, please check the following address to see "Windowless iframe Elements" Title: http://msdn.microsoft.com/Workshop/Author/dhtml/overview/compat.asp#windowlessFrames This The SELECT element becomes a unique window element. If you use the previous code in Internet Explorer 5.5, when you set the Select element's z-index value, it will be on the iFrame. When you set the SELECT element Z-index value, iframe will overwrite the Select element, even if they are non-window elements. This is the uniqueness of IFrame: it is arranged in Z-Index sequence and non-window elements Together, and can also be arranged together according to Z-Index and window elements, such as here and the SELECT element.</p>
<p>When you set the z-index value of the DIV element than iframe (such as 6), the DIV will override iframe. This is in line with the description of our above: iframes is the non-window, and it follows Z-Index's order and other non-windows The class elements are arranged together. When you set the z-index value and iframe (such as 5), it will still be on the DIV, because the order of the elements works. When you use the DIV element Z-Index The value is set to 6, and the select element and the z-index value of the Select element are 5, then the SELECT element will always be on the DIV because it is an element of the window class. However, iframe will be on the Select because it is In order to avoid this, the Z-index value of the SELECT element must be larger than iframe, or the select element must be ranked in the case of the z-index value, it will be on the iFrame. Because of this, z-indexing similar content can be difficult To work around this, use the following methods:. • use style sheets style property when necessary to hide and display elements • use DHTML Scriptlets Although behaviors are usually preferred, this is one instance.. WHERE Scriptlets Are Preferred. • In Internet Explorer 5.5, you can use Popup objects, use it you can display rich content on any element. This is very useful on the menu and tooltips. I want to know more, please The following address checks to "Popup Object": http://msdn.microsoft.com/Workshop/author/dhtml/reference/Objects/popup.asp</p>
<p>• Use the ActiveX control of the non-window class to replace the window class object. Unfortunately, all ActiveX controls have no universal universal implementation. Reference To learn more about IE-based Web development solutions, please visit the following Web site: http: //msdn.microsoft.com/workshop/entry.asp</p>
<p>http://msdn.microsoft.com/ie/</p>
<p>http://support.microsoft.com/?scid=http://support.microsoft.com/highlights/iep.asp?fr=0&sd=msdn________________________________________ applied • Microsoft Internet Explorer 6.0 Service Pack 1 • Microsoft Internet Explorer 5.5 Service Pack 2 and Internet Tools • Microsoft Internet Explorer 5.0 Keywords: KBBUG KBDHTML KBFAQ KBIEOBJ KBINFO KB177378</p></div><div class="text-center mt-3 text-grey">
转载请注明原文地址:https://www.9cbs.com/read-94940.html</div><div class="plugin d-flex justify-content-center mt-3"></div><hr><div class="row"><div class="col-lg-12 text-muted mt-2"><i class="icon-tags mr-2"></i><span class="badge border border-secondary mr-2"><h2 class="h6 mb-0 small"><a class="text-secondary" href="tag-2.html">9cbs</a></h2></span></div></div></div></div><div class="card card-postlist border-white shadow"><div class="card-body"><div class="card-title"><div class="d-flex justify-content-between"><div><b>New Post</b>(<span class="posts">0</span>)
</div><div></div></div></div><ul class="postlist list-unstyled">
</ul></div></div><div class="d-none threadlist"><input type="checkbox" name="modtid" value="94940" checked /></div></div></div></div></div><footer class="text-muted small bg-dark py-4 mt-3" id="footer"><div class="container"><div class="row"><div class="col">CopyRight © 2020 All Rights Reserved
</div><div class="col text-right">Processed:
<b>0.033</b>, SQL:
<b>9</b></div></div></div></footer><script src="./lang/en-us/lang.js?2.2.0"></script><script src="view/js/jquery.min.js?2.2.0"></script><script src="view/js/popper.min.js?2.2.0"></script><script src="view/js/bootstrap.min.js?2.2.0"></script><script src="view/js/xiuno.js?2.2.0"></script><script src="view/js/bootstrap-plugin.js?2.2.0"></script><script src="view/js/async.min.js?2.2.0"></script><script src="view/js/form.js?2.2.0"></script><script>
var debug = DEBUG = 0;
var url_rewrite_on = 1;
var url_path = './';
var forumarr = {"1":"Tech"};
var fid = 1;
var uid = 0;
var gid = 0;
xn.options.water_image_url = 'view/img/water-small.png';
</script><script src="view/js/wellcms.js?2.2.0"></script><a class="scroll-to-top rounded" href="javascript:void(0);"><i class="icon-angle-up"></i></a><a class="scroll-to-bottom rounded" href="javascript:void(0);" style="display: inline;"><i class="icon-angle-down"></i></a></body></html><script>
var forum_url = 'list-1.html';
var safe_token = 'bhwDVAD6bBp7LUmKXTo9j4Gbi0LYdc4inYR3P1VayUgYxWYbiP8dz1gVoWhSLMKgNx_2ByviC37zu0ZJmh24gG7g_3D_3D';
var body = $('body');
body.on('submit', '#form', function() {
var jthis = $(this);
var jsubmit = jthis.find('#submit');
jthis.reset();
jsubmit.button('loading');
var postdata = jthis.serializeObject();
$.xpost(jthis.attr('action'), postdata, function(code, message) {
if(code == 0) {
location.reload();
} else {
$.alert(message);
jsubmit.button('reset');
}
});
return false;
});
function resize_image() {
var jmessagelist = $('div.message');
var first_width = jmessagelist.width();
jmessagelist.each(function() {
var jdiv = $(this);
var maxwidth = jdiv.attr('isfirst') ? first_width : jdiv.width();
var jmessage_width = Math.min(jdiv.width(), maxwidth);
jdiv.find('img, embed, iframe, video').each(function() {
var jimg = $(this);
var img_width = this.org_width;
var img_height = this.org_height;
if(!img_width) {
var img_width = jimg.attr('width');
var img_height = jimg.attr('height');
this.org_width = img_width;
this.org_height = img_height;
}
if(img_width > jmessage_width) {
if(this.tagName == 'IMG') {
jimg.width(jmessage_width);
jimg.css('height', 'auto');
jimg.css('cursor', 'pointer');
jimg.on('click', function() {
});
} else {
jimg.width(jmessage_width);
var height = (img_height / img_width) * jimg.width();
jimg.height(height);
}
}
});
});
}
function resize_table() {
$('div.message').each(function() {
var jdiv = $(this);
jdiv.find('table').addClass('table').wrap('<div class="table-responsive"></div>');
});
}
$(function() {
resize_image();
resize_table();
$(window).on('resize', resize_image);
});
var jmessage = $('#message');
jmessage.on('focus', function() {if(jmessage.t) { clearTimeout(jmessage.t); jmessage.t = null; } jmessage.css('height', '6rem'); });
jmessage.on('blur', function() {jmessage.t = setTimeout(function() { jmessage.css('height', '2.5rem');}, 1000); });
$('#nav li[data-active="fid-1"]').addClass('active');
</script> 
