Purpose
I have seen many questions on "scrollable content in design studio", also this requirement, Design Studio - automate table width dependingly to the number of dimensions.
Basics
A Panel in Design Studio is visualized by DIV element, it shows by default the content as overlay, no scrolls are available. This can be changed by CSS:
the class responsible for this setting is "div.zenborder". you can define new classes, overwritting this one.
div.zenborder div.scroll-x {
/* allow X scroll */
overflow-x: scroll !important;
/* do not allow Y scroll */
overflow-y: hidden !important;
}
div.zenborder div.scroll-y {
/* do not allow X scroll */
overflow-x: hidden !important;
/* allow Y scroll */
overflow-y: scroll !important;
}
div.zenborder div.scroll-xy {
/* allow X scroll */
overflow-x: scroll !important;
/* allow Y scroll */
overflow-y: scroll !important;
}
div.zenborder div.hidden {
/* do not allow X scroll */
overflow-x: hidden !important;
/* do not allow Y scroll */
overflow-y: hidden !important;
}
Then, as next poing, you jsut need to assign the new class to the css class propery on the corresponding panel:
or you can make this via script:
PANEL_1.setCSSClass("scroll-x");
now, the panel will get scrollbar on X axis:
Here is the example application:
I hope this help some of you in your Ux requirements.
You must be a registered user to add a comment. If you've already registered, sign in. Otherwise, register and sign in.
User | Count |
---|---|
36 | |
25 | |
17 | |
13 | |
8 | |
7 | |
6 | |
6 | |
6 | |
6 |