Scrolling sheet modal

I have a sheet modal that I open up on top of my app, which has more content than room. I was hoping it could just scroll.
Works great on browser and android, but ios is scrolling the content behind the modal, not the content in the modal. Any ideas on how I can fix?

Looking further, it seems I used overflow to try to accomplish this. Maybe there is a better way.
code that I use to open is as follows :

function sheetModal(title,message) {
// Create dynamic Sheet
var dynamicSheet = app.sheet.create({
height: “70%”,
content: ‘<div class=“sheet-modal”>’+
‘<div class=“toolbar”>’+
‘<div class=“toolbar-inner”>’+
‘<div id="fitModalTitle class=“left”>’+title+’</div>’+
‘<div class=“right”>’+
‘<a class=“link sheet-close”>Done</a>’+
‘</div>’+
‘</div>’+
‘</div>’+
‘<div id=fitModalInner class=“sheet-modal-inner”>’+
‘<div class=“block”>’+
‘<p>’+message+’.</p>’+
‘<p><a href="#" class=“link sheet-close”>Close me</a></p>’+
‘</div>’+
‘</div>’+
‘</div>’,
// Events
on: {
open: function (sheet) {
console.log(‘Sheet open’);
},
opened: function (sheet) {
console.log(‘Sheet opened’);
},
}
});
dynamicSheet.open();
Dom7("#fitModalInner").css(“overflow”,“auto”);
// Events
on: {
open: function (sheet) {
console.log(‘Sheet open’);
},
opened: function (sheet) {
console.log(‘Sheet opened’);
},
}
});
dynamicSheet.open();
Dom7("#fitModalInner").css(“overflow”,“auto”);
}

Put page-content inside

<div class="sheet-modal">
  ...
  <div class="sheet-modal-inner">
    <div class="page-content">
      ...
    </div>
  </div>
</div>
2 Likes

thank you so much. I see it in another post now too, sorry.
Works perfectly