javascript - Push div to top after changing position of other div -

javascript - Push div to top after changing position of other div -

please help me here. have 3 ul in page. ul 1 variable height ul 2 variable height ul 3 variable height suppose if want force ul 2 middle of screen such ul 1 goes top automatically & part of ul 1 visible in screen.i mean say, ul 1 may 1 50 % , ul 2 may 50 ..... of screen height.pls help me in implementing this.

<div> future </div> <ul> <li> list 1 </li> <li> list 2 </li> <li> list 3 </li> ....... </ul> <div> today </div> <ul> <li> list 1 </li> <li> list 2 </li> <li> list 3 </li> ....... </ul> <div> past </div> <ul> <li> list 1 </li> <li> list 2 </li> <li> list 3 </li> ....... </ul>

all 3 can nowadays in page. assume future records exceeds height of page, in scenario, want force today block center of screen & future top.i have implemented iscroll entire page & woring fine. stuck how force today block center of screen future info automatically goes up.

use z-index check illustration here.hope helps

javascript jquery html css