left: 50%, top: 50%
left: 20%, top: 20%
left: 80%, top: 80%
Example 5. - Responsive layout & yourLogo sample
In this example, the width of the LayerSlider container is set to 80% and all the sublayers have percentage values. Note, that if you want to add left and top properties of sublayers in percentage instead of pixels, you have to use style tags on these sublayers!
The three leaves and white shapes in both of the layers are positioned:
1. left: 20%, top: 20%
2. left: 50%, top: 50%
3. left: 80%, top: 80%.
Note, that in this case the left and top properties will point to the center of the current sublayer! For example if you add style="left: 50%; top: 50%;" to a sublayer, than it will be in the absolute center of the layer.
Try to pause the slideshow and resize your browser. The sublayers are repositioned themselves.
We used also yourLogo feature of LayerSlider 1.7 - see our fixed logo at the top left of the LayerSlider container.