HIGHLY RECOMMENDED !
I strongly recommend using Method 1 above Method 2
With Method 1 the object is not processed, it maintains much more of a WYSIWYG feel , and in most situation will be sufficient
Note also the difference that if the target is a Layer the object will be repositioned inside the Layer with Method 1
While with Method 2 the object will be taken out of the Layer and is repositioned relative to the Layers position
Mode | force Method 2 can be extremely useful, but should be used with Caution!
Any web-design should be tested for cross-browser compatibility, but if Method 2 is used, check with an exclamation mark ... !
method 1: ----------+ -------+
01. mode window level |--- mode | target |
02. mode object level ----------+ |--- mode | force
method 2: ----------+ |
03. mode window level |--- mode | target |
04. mode object level ----------+ -------+
method 3:
05. mode matrix <------------------------| specialized mode
I strongly recommend using Method 1 above Method 2
With Method 1 the object is not processed, it maintains much more of a WYSIWYG feel , and in most situation will be sufficient
Note also the difference that if the target is a Layer the object will be repositioned inside the Layer with Method 1
While with Method 2 the object will be taken out of the Layer and is repositioned relative to the Layers position
Mode | force Method 2 can be extremely useful, but should be used with Caution!
Any web-design should be tested for cross-browser compatibility, but if Method 2 is used, check with an exclamation mark ... !
method 1: ----------+ -------+
01. mode window level |--- mode | target |
02. mode object level ----------+ |--- mode | force
method 2: ----------+ |
03. mode window level |--- mode | target |
04. mode object level ----------+ -------+
method 3:
05. mode matrix <------------------------| specialized mode
__________________________________________________________________________
more info on module | reposition see here Properties
more info on module | reposition see here Overview
more info on module | reposition see here Overview Target
more info on module | reposition see here Properties
more info on module | reposition see here Overview
more info on module | reposition see here Overview Target
MODULE REPOSITION MODE FORCE - OVERVIEW
Reposition On
Window or Object Level
+ Matrix Mode
Window or Object Level
+ Matrix Mode
PLUGIN
EXPLAIN ?
Module | reposition is a collection of multiple modules combined in one, it operates in 5 modes
Module | reposition is a collection of multiple modules combined in one, it operates in 5 modes
method 1:
01. mode window level
02. mode object level (+in Layer)
method 2:
03. mode window level
04. mode object level (+in/out Layer, complex structures)
method 3:
05. mode matrix
This section will focus on Method 2 - 01. mode window level and Method 2 - 02. mode object level
01. mode window level
02. mode object level (+in Layer)
method 2:
03. mode window level
04. mode object level (+in/out Layer, complex structures)
method 3:
05. mode matrix
This section will focus on Method 2 - 01. mode window level and Method 2 - 02. mode object level
METHOD 1
To understand what mode | force does
and what Method 2 distinguishes from Method 1 we need to know what Method 1 actually does
Method 1 does it's manipulation on objects without altering anything other then calculating a new position and/or dimension
The object is never processed, it never leaves the page
THE POSITIVES OF METHOD 1:
The positive is, the object is not processed and is therefore less prone to side effects if the object needs
to be manipulated in a later process
Another positive is the object is just moved, shifted, maintaining it's stacking order as it is positioned in design time
Which makes it much more intuitive to work with, it maintains a greater WYSIWYG feel
THE NEGATIVES OF METHOD 1:
Module | reposition Method 1 internally does a lot of calculating adjusting for many different structures in Webbuilder
Objects are adjusted on window-object level, inside-outside Layer, page center, Layer alignment, fixed-absolute position, border etc
But in even more complex scenarios just calculating may not be sufficient
ie. an object inside a Layer can not be repositioned outside a Layer and vice versa
Or a complex scenario of an object inside a Layer inside a Masterpage in a ... etc , repositioning with Method 1 will most likely fail
To understand what mode | force does
and what Method 2 distinguishes from Method 1 we need to know what Method 1 actually does
Method 1 does it's manipulation on objects without altering anything other then calculating a new position and/or dimension
The object is never processed, it never leaves the page
THE POSITIVES OF METHOD 1:
The positive is, the object is not processed and is therefore less prone to side effects if the object needs
to be manipulated in a later process
Another positive is the object is just moved, shifted, maintaining it's stacking order as it is positioned in design time
Which makes it much more intuitive to work with, it maintains a greater WYSIWYG feel
THE NEGATIVES OF METHOD 1:
Module | reposition Method 1 internally does a lot of calculating adjusting for many different structures in Webbuilder
Objects are adjusted on window-object level, inside-outside Layer, page center, Layer alignment, fixed-absolute position, border etc
But in even more complex scenarios just calculating may not be sufficient
ie. an object inside a Layer can not be repositioned outside a Layer and vice versa
Or a complex scenario of an object inside a Layer inside a Masterpage in a ... etc , repositioning with Method 1 will most likely fail
METHOD 2
In these situations we can switch to Method 2
With mode | force we again modify the method in which module | reposition operates
Instead of just calculating a new position and/or dimension the object is removed and then reinserted back into the page
This is exactly what module | reposition Method 1 tries to avoid but can be a good enhancement if used with caution
The positives and negatives of this method are almost the reverse of Method 1
THE NEGATIVES OF METHOD 2:
The first difficulty with this method is, it is not cross-browser compatible, the outcome may differ per browser - Caution!
The second most obvious problem is the stacking order, the object is reinserted, therefore it has no reference of a stacking order
Module | reposition adjusts this behavior by taking the z-index of the target and inserts the object in front or behind the target
If the target is window then in back will set a z-index of -1 and in front will set a z-index of 2000 by default
The z-index can also manually be set by using the property z-index | stack
The negative is thus, the object is processed, it is removed and reinserted back into the page
And it does not maintain it's stacking order, and therefore has less or none of a WYSIWYG feel to it
THE POSITIVES OF METHOD 2:
The positives of Method 2 is it has little boundaries in complex structures
Objects can be repositioned from inside a Layer to inside another Layer, or from inside a Layer inside a Masterpage outside a ... etc
It suits complex situations
In these situations we can switch to Method 2
With mode | force we again modify the method in which module | reposition operates
Instead of just calculating a new position and/or dimension the object is removed and then reinserted back into the page
This is exactly what module | reposition Method 1 tries to avoid but can be a good enhancement if used with caution
The positives and negatives of this method are almost the reverse of Method 1
THE NEGATIVES OF METHOD 2:
The first difficulty with this method is, it is not cross-browser compatible, the outcome may differ per browser - Caution!
The second most obvious problem is the stacking order, the object is reinserted, therefore it has no reference of a stacking order
Module | reposition adjusts this behavior by taking the z-index of the target and inserts the object in front or behind the target
If the target is window then in back will set a z-index of -1 and in front will set a z-index of 2000 by default
The z-index can also manually be set by using the property z-index | stack
The negative is thus, the object is processed, it is removed and reinserted back into the page
And it does not maintain it's stacking order, and therefore has less or none of a WYSIWYG feel to it
THE POSITIVES OF METHOD 2:
The positives of Method 2 is it has little boundaries in complex structures
Objects can be repositioned from inside a Layer to inside another Layer, or from inside a Layer inside a Masterpage outside a ... etc
It suits complex situations
