ios - 图层 slider - 框阴影窗口在 iPhone/iPad 上不起作用

Question

我创建了一种“窗口”，可以滑动以显示更多图像，请参阅 - http://sysmarketing2014.squaresystem.co.uk/

它似乎适用于所有浏览器(除了 IE8 以下版本 - 我也可以修复)，甚至适用于 Windows 手机和安卓系统。它也适用于 Safari iPhone 用户代理。

它似乎无法在我的 iPad 或 iPhone 上运行，但是......它们都运行 iOS8

有什么想法吗？

Answer 1

我已经解决了这个问题，它与 iOS 上的框阴影有关。

iOS 设备不会呈现扩展大小为 2000 像素的框阴影。我发现我可以输入的最大数字是 850px 左右。

似乎是iOS特有的问题

.ls-slide .peep {
  position: relative;
  width: 100%;
  height: 100%;
  overflow: hidden;
  padding: 0 1000px;
  z-index: 100;
}
.ls-slide .peep:after {
  content: ' ';
  position: absolute;
  top: 10%;
  border-radius: 100%;
  width: 300px;
  height: 300px;
  box-shadow: 0 0 0 2000px #72B626, inset 6px 6px 30px -4px #000;
  -webkit-box-shadow: 0 0 0 2000px #72B626, inset 6px 6px 30px -4px #000;
  -moz-box-shadow: 0 0 0 2000px #72B626, inset 6px 6px 30px -4px #000;
  margin: 0 auto;
  left: 0;
  right: 0;
  z-index: 200;
}


.is-ios-device .ls-slide .peep:after {
  -webkit-box-shadow: 0 0 0 850px #72B626, inset 6px 6px 30px -4px #000;
}

我更改了点差值并解决了问题。