Question

我正在构建一个网站，其标题包含一个包含选择菜单的固定位置。由于位置：固定在css中，标题应该保持锁定在屏幕顶部。但是，当在iphone上的移动Safari中单击选择菜单时，当打开ios选择菜单时，标题不再保持锁定在顶部。似乎ios将div与选择菜单对齐到菜单上方屏幕的可见区域。当页面滚动到顶部时不会发生这种情况，但是当地址栏不可见时，它会像这样“中断”。没有找到任何其他答案，也许我问的问题是错误的。我无法发布代码链接，感谢任何帮助。

http://selfconstruc.tv/menu-open.PNG http://selfconstruc.tv/menu-closed.PNG

Answer 1

目前我不认为有一个完美的解决方案来处理焦点跳跃。在我的情况下，我将焦点隐藏在焦点中并再次显示焦点，并且效果很好。我不知道在你的情况下，这可能是一种解决方法。

你可以试试这个：

// detect ios device
if(navigator.userAgent.match(/(iPad|iPhone|iPod)/gi)){
  // hide header on focus in and show on focus out
  jQuery("#content").focusin(function(){
    jQuery('#your-header-id').hide();
  })
  jQuery("#content").focusout(function(){
    jQuery('your-header-id').show();
  })
}

#content是一个div，你应该拥有所有控件，jQuery .focusin（）检测父元素上的焦点事件，因此每个控件都会触发焦点事件。您将焦点隐藏在焦点上并在此之后显示。希望这有帮助！

在移动游猎，iphone上固定位置的div内选择菜单

1 个答案: