user435245 user435245 - 14 days ago 4x
CSS Question

Collapsible panel and dynamic positioning of dropdown menu

I'm developing a code which needs to dynamically position a drop down menu which is inserted under a collapsible panel. The problem is when the panel get collapsed you need to scroll vertically in order to come to the drop down, drop down get lost and opens outside of the windows. But when the collapsible is closed everything works fine. What is the JQuery positioning code which always accurately opens drop down under the button in different screen sizes and different scroll bar positions? here is the sample code I developed:,css,js,output


Hey the problem is you are not calculating the ScrollValue : i added "- $(document).scrollTop()" and everything works perfect

$(".dropdown").on('click', function() 
    $(this).find('.dropdown-menu').css('top',$(this).offset().top - $(document).scrollTop() + 30);