لطفا منتظر باشید ...
Introduction to Layers
When you think of layers, if the first thing that comes to mind are digital imaging programsstop . Although a stacking order is associated with Dreamweaver layers, they're better known for alternative web page design options than they are for creating collages and masking effects. Layers in the world of web design means freedom from messy table workarounds and total control of content layout. To achieve this, layers expose properties for precise placement of elements on the page. Even better, layers offer a third dimension, much like their names suggest. This dimension is called the z-index , ripped from geometric practices based on x, y, and z coordinates. The higher a layer's z-index value, the closer it appears to the front of the screen. The lower the z-index value, the further away it seems, resulting in an item closer to the background.Precise placement of elements on the page? Why would you ever fumble with tabled structures again? This is the question that plagues designers and developers. The answer lies in your user's target browser, which, for the most part, is impossible to know. For layers to be visible in a browser, the browser must be a 4.0 or later version of Netscape or Internet Explorer. For advanced properties exposed by layers to be viewed correctly, the browser must be a newer browser version such as Netscape 7, Internet Explorer 6, or Firefox 1. Figure 11.1 shows the Dorknozzle website design using layers in Firefox.
Figure 11.1. The Dorknozzle site, designed using layers, shown in the Firefox browser.
[View full size image]
Figure 11.2. The Dorknozzle site, designed using layers, shown in the Netscape 4.8 browser.
Before we get ahead of ourselves, however, let's backtrack a bit by introducing and discussing the evolution of layers. In the late 1990s, the W3C established a ne233 4.0 specification that introduced radical changes to the way developers could writ215, and even better, format tha230 using a new and more robust CSS specification. Combined with JavaScript, the phenomena was coined Dynami213 (DHTML) and thus introduced designers and developers to a whole new way of working with web pages. The idea was simple: DHTML was the harmonious combination o216, CSS, and JavaScript. Among other things, DHTML would allow developers to change the style declarations of a224 element by means of JavaScript. Even better, through the use of "layers," elements on the page could be precisely positioned in the browser window using absolute or relative positioning properties. As part of this transition, browsers scrambled to support what was touted as the next "big thing" in web development.
