Popping Out of Hidden Overflow

It would be great if somone could help coding the below:

I have a repeated group rendered as a table.
Overflow X of this repeated group is scroll.

CSS:
#group7,#group40{ 
    overflow-x: scroll;
}

However as per this explanation https://css-tricks.com/popping-hidden-overflow/
CSS will set the overflow y on auto.

So i have postioned the :

CSS:
.chzn-container .chzn-drop {
    position: relative!important;
}

this will work and force the container to expand.

However it would be nicer if i can get the drop down of the chzn to overflow over the container border.

In this thread they explained how to do it however my js coding skills are very limited:
https://css-tricks.com/popping-hidden-overflow/
JavaScript:
.table { overflow-y:scroll; width:100%; height:100px; }
.chzn-container .chzn-drop { position:relative; }
.chzn-container .chzn-drop { position: absolute; left: 80px;width:200px; top:0px; border: 1px solid black; }

Can someone help me?
 
Sorry about the delay. Do you still need help with this? And is this the code you need to figure out?

JavaScript:
$(function() {
  // whenever we hover over a menu item that has a submenu
  $('li.parent').on('mouseover', function() {
    var $menuItem = $(this),
        $submenuWrapper = $('> .wrapper', $menuItem);
   
    // grab the menu item's position relative to its positioned parent
    var menuItemPos = $menuItem.position();
   
    // place the submenu in the correct position relevant to the menu item
    $submenuWrapper.css({
      top: menuItemPos.top,
      left: menuItemPos.left + Math.round($menuItem.outerWidth() * 0.75)
    });
  });
});

-- hugh
 
We are in need of some funding.
More details.

Thank you.

Members online

Back
Top