The Scroller setup is in many ways similar to the Slider
template ... the main difference being that rather than being limited to the horizontal slide you can plot x and y co-ordinates to scroll across the page/container.
Here is a quick overview of the setup and positioning of the various elements.
- There are 9 user modules plus the main content area in the scrolling window. When the page is refreshed it reverts to displaying the main content or component area.
- Each menu link on the top links to one of the 10 points. They are listed in order so the first menu item scrolls to the main content, the second scrolls to the first user
module, the third menu item scrolls to the second user position and so on.
- The sliding panels contain the modules advert 1 and advert 2 and the tabs will only be displayed when those modules are published.
Setting up the template.
The main configuration occurs in the index.php file where you can set the following:
- The general height and width of the container.
- Fixed or scrolling background image.
- The _style_ of the template.
- Choose the speed and type of transition for the scroller.
- Choose the speed and type of transition for the sliding panels.
- Choose whether to use slimbox extended or not.
- Menu items: This is where you nominate the name of the menu items that appear above the sliding area. Each menu item corresponds to their relative user module. ie menu_item1 relates to user module 1.
- Setting the co-ordinates for the scroll positions involves just nominating a top and left position. This is the amount of distance in pixels from the top and left of the container.
As an example if you wanted the modules to scroll horizontally you would use the same top position and just make the left position incrementally 10px or so more than the width of the container. eg module 1: top:0;left:0 module 2: top:0; left:410, module 3:top 0;left 820 and so on.
The same goes for having the scroller scroll vertically. Just position each module at the same left co-ordinate but change the top variable.
The background can either ve fixed or scroll with the content. This is set in the index.php file again. Choose between scrolling or fixed and then edit the respective css file ie edit the fixed.css or scrolling.css - just changing the background-image property.
From here all you need to do is to plug your info into the module positions and publish them and your content will appear.
If you have any other queries setting up the template please just post them below.
Favoured: 0
