jquery - fancybox scroll is not displayed on the iPad, but displayed in browser -

jquery - fancybox scroll is not displayed on the iPad, but displayed in browser -

i have a page scrollbar in fancybox not displayed ipad displayed google chrome desktop url http://jsfiddle.net/wqm0x21n/1/ can scroll fancybox content, there no vertical scroll bar when visit ipad.

any ideas how create work? solutions found such applying:

#fancybox-inner{ overflow:scroll; -webkit-overflow-scrolling:touch; }

didn't help.

and here jsfiddle code, if needed:

js:

$(".fancytrigger").fancybox({ fittoview: false, autosize: false, afterload: function () { this.width = 200; this.height = 200; } }); $(".fancytrigger").trigger('click');

css:

#thefancybox { display: none; } #fancybox-inner{ overflow:scroll; -webkit-overflow-scrolling:touch; }

hmmm, i’ve taken closer @ code , made next adjustments you:

although referenced in css, missing #fancybox-inner div container element in html. see updated jsfiddle: http://jsfiddle.net/nxn46e3t/

have modified css parent div reference scrolling, need tell how big (hence width , height attributes set 100%)

body { background-color: #eef; } #thefancybox { overflow:auto; -webkit-overflow-scrolling:touch; width: 100%; height: 100%; } #fancybox-inner{ }

i’ve tested on ios , scrollbar appears when scrolling:

complete working jsfiddle illustration can found here (as above) http://jsfiddle.net/nxn46e3t/

let me know how works you.

good luck!

jquery html css ipad fancybox