Elxis CMS Forum
Extensions => Templates => Topic started by: muharihar on January 14, 2009, 17:03:11
-
hi all....
i want to design a template with "dinamic css column" (please take a look the pic's on attacthment)
any one can help me?
note:
1. Pic 1 -> when we click menu "ALL" there is 3 column displayed
2. Pic 2 -> when we click menu "2 COLUMN (LEFT)" there is 2 column displayed (Column 1 and Column 2-> the width incresed to right), the assumtion: only modul with position on the left and content is displayed, no modul in the right position
3. Pic 3 -> when we click menu "2 COLUMN (RIGHT)" there is 2 column displayed (Column 2-> the width incresed to left and Column 3), the assumtion: only modul with position on the right and content (center) is displayed, no modul in the left position
4. Pic 4 -> when we click menu "ONE" there is only 1 column displayed (Column 2 -> the width incresed to left and rigth),
the assumtion: only modul with position on the content (center) is displayed, no modul in the left and right position
[attachment deleted by admin]
-
Please be more specific ... you showing the result you want but how you want this "dynamic" column to appear/disappear?
when loading page... when clicking a button when?
also you may post -if you wish so - an add to job-offering-adds category in this forum.
https://forum.elxis.org/index.php?board=48.0
-
This has been done with using javascript, css and cookies on the free "BlueBell HC" template (HC stands for Hide Columns). You can download and study the template.
Here is a tip:
You should play with elements "display" and "width" (you can also use "visibility").
Case a (everything is visible)
left column: width 20%, display: block
mid column: width: 60%, display: block
right column: width 20%, display: block
Case b (right column is hidden)
left column: width 20%, display: block
mid column: width: 80%, display: block
right column: width 0, display: none
Case c (left+right column are hidden)
left column: width 0, display: none
mid column: width: 100%, display: block
right column: width 0, display: none
-
@ks-net
the information about "dynamic" was updated to the first post. ;)
@Datahell
Thanks Datahell, i will download the free "BlueBell HC" template and study it.
-
@Datahell
Thanks Datahell, i will download the free "BlueBell HC" template and study it.
[/quote]
Fix
In customize.css of "BlueBell HC" template, near line 109
find this
/* form button hover */
.button {
and replace it with:
/* form button hover */
.button:hover {