Problem with layout

[r.martinezParticipant]

Hello, I’ve been trying without success for a couple of days to make this layout.

Any help would be appreciated.

Best regards.

The lauout consists in 3 vertical parts, from left to right:

A: a part, collapsed by default, with a “fixed” width when it’s collapsed.
B: a part that is composed by 2 parts (top & bottom) divided by a vertical splitter
C: a part that occupes the 100% of the available height.

When the icon in the A part is clicked, A part extends until a fixed width (no splitter between A & B parts) Part A can be collapsed or expanded, but no splitter between A & B.
When the A part is expanded and button clicked, A part collapses.

I would prefer the parts A, B & C don’t have any “title”. They should be only conaiteners of the DIVs data content.

I attached an image as example.

• This topic was modified 6 years, 1 month ago by  r.martinez.
• This topic was modified 6 years, 1 month ago by  r.martinez.

[DimitarParticipant]

Hello r.martinez,

Unfortunately, jqxLayout is not a suitable widget to achieve this layout because panel titles cannot be removed. It would also not be possible to restrict the resize behaviour only of section A. We suggest you use jqxSplitter for parts B and C and for part A use a custom div. You can also probably try using a vertical jqxRibbon for A if that suits your purposes.

Best Regards,
Dimitar

jQWidgets team
http://www.jqwidgets.com/

[r.martinezParticipant]

Thanks Dimitar!

Just it was one of my tries, but I couldn’t get it work. Would you mind to show me a minimal skeleton?

Sorry for to ask so simply and silly question, but I’m stucked. I can post all of my previous tries if you prefer.

Best regards.

[r.martinezParticipant]

Got it. I’ve tried again with Ribbon and Splitter, and I finally managed to get it work.

What failed here was the combination between Ribbon & Splitter. Ribbon should be created after the Splitter, as you saind in other forum post.

http://www.jqwidgets.com/community/topic/jqxribbon-and-jqxsplitter-2/

Best regards.

[Author]

Posts