Initialization

There are four ways to initialize a dhtmlxlayout object:

But firstly, befove moving to the main initialization - make some preparatory steps:
1. Download the dhtmlxLayout package from the server and place it in a folder
2. Create an index.html file
3. Place the full paths to dhtmlxLayout's CSS and JS files into the header of html file

<head>
        <link rel="stylesheet" type="text/css" href="[full path to this file]/dhtmlxlayout.css">
        <link rel="stylesheet" type="text/css" href="[full path to this file]/dhtmlxlayout_dhx_blue.css">
        <script src="[full path to this file]/dhtmlxcommon.js"></script>
        <script src="[full path to this file]/dhtmlxcontainer.js"></script>
        <script src="[full path to this file]/dhtmlxlayout.js"></script>
 
</head>

'dhx_skyblue' is the default skin. If you want to apply another skin - specify path to the appropriate dhtmlxLayout_[name_of_the_skin].css file from the dhtmlxLayout package.

If you need to work with all available visible space, we recommend to specify the following style for the <body> tag in order that dhtmlxLayout and dhtmlxWindows work correctly:

width:100%; height:100% - provides correct work of a fullscreen layout
margin:0px - hides the default body space
overflow:hidden - hides body scrolls

<style>
    html, body {
        width: 100%;
        height: 100%;
        margin: 0px;
        overflow: hidden;
    }
</style>

The further steps depend on the initialization you will choose.