jquery - Fixed position div getting hidden for the smaller screen -

jquery - Fixed position div getting hidden for the smaller screen -

my code

i have created basic construction of html using bootstrap.

my issue when height of drop downwards in larger screen bottom part of drop downwards gets hidden header set using position: fixed.

i have lastly alternative add together scroll drop downwards if height greater screen.

i wants drop downwards scroll when larger screen. header position: fixed not able scroll drop down.

is there way out of this? give thanks you.

you can seek doing this

what did on window scroll calculated difference between height of screen , drop down.

and moved drop downwards using difference.

here code it.

jquery

var lastscrolltop = 0; $(window).scroll(function () { var pageheight = $(window).height() - $('.navbar').height(); if ($(window).height() < $('.dropdown-menu').height() && $('.dropdown-menu').height() > pageheight && $('#dropdownbtn').hasclass('activebtn')){ var scrollmove = $('.dropdown-menu').height() - pageheight; $('.dropdown-menu ').css('margintop',-scrollmove); } var st = $(this).scrolltop(); if (st < lastscrolltop){ $('.dropdown-menu').css('margintop','0'); } lastscrolltop = st; })

jquery html css css-position