Fixed button in mobile devices

Question

I would like to have a shopping cart button fixed to the bottom of the screen in mobile devices. By pushing it, the content of the cart is shown. I managed to do this, but it acts quite weird - at least in my Android phone. When I scroll up the address bar is shown which pushes content down including the button. The button pops up into its fixed place when stop dragging.

How can I avoid this?

Here is the SCSS/CSS:

#cart-wrapper{
//display: none;
margin-top: 0;
position:fixed;
width:100%;
top:100%;
right:0;
background-color:white;
padding-top: 20px;
padding-bottom:20px;
z-index:999;
.cartIcon{
  display:block;
  background-color:white;
  position:absolute;
  right:20px;
  padding:10px;
  top:-45px;
}

}

So the whole cart is positioned so that only the button is shown and by pushing it top-property is animated (javascript) so that the rest is shown.

Thanks for your answers!