jQuery UI layout plug-in OVERFLOW setting

Question

jsFiddle is provided for better illustration. In this case I am using two plugins: jQuery UI layout plugin & Trent datetime picker plugin.

The pop-up datetime picker will be blocked by the west pane resize bar. If I set option west__showOverflowOnHover: true, the scroll bar won't work. I am follow the overflow setting instruction here, but still not get it through yet.

Or maybe there is a conflict between these two plugins?

The problem is the bar that divides in two the screen, which is overlapping the datepicker? — Luis, Commented Jul 11, 2012 at 18:24
yes, that's my problem. I want the date picker will be on the upper layer. Let me know if you still not quite sure. Thanks — sozhen, Commented Jul 11, 2012 at 18:26

Luis · Accepted Answer · 2012-07-11 18:29:52Z

2

Your problem is the z-index, in this file jquery-ui.css search for the class .ui-datepicker and add the property like this:

.ui-datepicker {
   width: 17em;
   padding: .2em .2em 0;
   z-index: 100 !important;
}

For the moment I overwrite the class, you can check it here

Hope it helps!

answered Jul 11, 2012 at 18:29

Luis

5,9148 gold badges45 silver badges63 bronze badges

Thank you very much. Problem solved! I was waiting the count down to accept your answer.. very quick answer, lol
– sozhen
Commented Jul 11, 2012 at 18:34

Add a comment |

Collectives™ on Stack Overflow

jQuery UI layout plug-in OVERFLOW setting

1 Answer 1

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Related