0

I have a modal pop up using this as a basis:

http://codepen.io/maccadb7/pen/nbHEg

.modal:before {
  content: "";
 display: none;
 background: rgba(0, 0, 0, 0.6);
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
  bottom: 0;
  z-index: 10;
}
.modal:target:before {
 display: block;
}
.modal:target .modal-dialog {
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
top: 20%;
}

I have tweaked it slightly accommodating for long form content as I am doing here:

http://media.conceptcomms.com/CloseBrothers@DataCapture.html/AD56HWB

The codepen demo scrolls to the bottom but I need to scroll to the top. I have positioned the modal 'absolute' rather than 'fixed', so the user can scroll to view, but the initial state is obscured by scrolling to the bottom.

I have tried positioning it higher up, but its going underneath the header content, and that is a headache I don't want to get into. Messing around with z-indexes has not worked.

I have also tried ScrollToTop(), but this disabled the modal.

Any help would be greatly appreciated.

Balerdio
  • 71
  • 9
  • This might help [JQuery scroll to top of Bootstrap Modal](http://stackoverflow.com/questions/17180621/jquery-scroll-to-top-of-bootstrap-modal) – Ahmed Abu Taha Feb 10 '16 at 14:04
  • Thanks Ahmed, not sure if its because I am not using Bootstrap modal, but this does not seem to be working... – Balerdio Feb 10 '16 at 14:16

0 Answers0