asp.net - Element's clickable area drifted up from actual position on Ipad Safari -


i'm having little problem asp .net site on ipad safari. have following form:

  • a div overlayed on top of main form.
  • in div have update panel 4 or 5 drop down lists.
  • each drop down list when changed pull data db , populate gridview on same div.

on pc using chrome, ff, ie..., site works great. on ipad safari, have weird problem:

  • after user changing drop down list, there chance clickable area of elements drift upward elements's actual position.
  • for example, when click on button, nothing happens, if want use button, have click empty area few dozen pixel above it. same goes textarea, radio button,...
  • the amount clickable area drift upward not seem fixed, time drift hundreds of pixels, while other time drift dozen pixels or so, clickable area drift same amount.
  • zoom in/zoom out on page or select textbox reset clickable areas right positions.

i'm using .net framework 4.5, , testing on ipad using ios 8.3. unfortunately, can't reproduce using js , html alone.

i found answer strange issue. apparently, when scroll , down on overlay div, might scroll main form accident. if scroll main form overlay div, when click on drop down list , populate gridview, clickable areas on overlay div drift up. more scroll main form, more clickable areas drift.

i fix issue adding following function onclick event of drop down list:

function fixclickabledrift() {     $(window).scrolltop(0);   } 

now matter how scroll main form, when click on drop down lists, function reset main form's position top of page. hope helpful in future.


Comments