Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
55
Grip bars and moving the collapse button...
posted

I have a requirement to use your WebSplitter control in a Web App and I am having trouble achieving the intended behaviour. I am trying to determine if they are possible, and if not, maybe they will serve as suggestions for future options?

 

1) It appears when you mouse over the entire splitter bar, the cursors charges and you can grab and move resize the panes at any point along the splitter bar. We were looking for a image in the center of the bar (AKA "grips") that you would click on just these to "grab" the splitter bar and resize it. I am having trouble determining if we can place an image there and how to make it only grab on that image. Or at the very least to put the image centered there would help.

 2) For the expand collapse button, we want that image at the TOP of the splitter bar(We have a splitter bar running top to bottom with a left and right panel. I tried declaring my splitter bar like this: 

<SplitterBar CssClass="SplitterBar6" CollapseButtonCssClass="CollapseButton5">

In both CSS classes I set:

vertical-align: top;

But the Collapse button ALWAYS appears in the center of the splitter bar!?!?

Any info would be appreciated..

 

Thanks,

Adam

  • 19308
    posted

    As you've found the splitter will allow resize to occur anywhere on the splitterbar.  The center area is reserved for the collapse button.  Rather than using vertical-align to reprosition the collapse button, try using position:relative or position:absolute, and se the top and left of the button accordingly.

    -Tony