Question

对于包含caroussel的页面，我具有以下结构。您可以水平滚动轮播，这样就可以了。

var array = [
  { "name": "CoffeShop", "tag": ["Coffee", "Cookies"] },
  { "name": "TeaShop", "tag": ["Tea"] },
  { "name": "IceCreamShop", "tag": ["Ice Cream"] },
  { "name": "Foo", "tag": ["Coffee"] },
  { "name": "Bar", "tag": ["Cookies"] }
]

var tags = ["Coffee", "Cookies"]
var result = array.filter(function(item) {
  return item.tag.filter(function(tag) {
    return tags.includes(tag)
  }).length === tags.length;
});
console.log(result);

使用

<div id="wrapper">
    <div id="caroussel">
      <div>CONTENT THAT IS WIDER THAN CAROUSSEL </div>
    <div>
SOME MORE CONTENT
</div>

现在，如果您使用的是iO和safari，则在触摸卡鲁塞尔时，垂直滚动包装器将不起作用。您必须抬起手指并触摸其他地方。将手指放在卡塞尔上，您只能向右或向左滚动。

所有其他设备和浏览器似乎都可以正常工作。尽管这类问题在野生动物园看来很常见，但我似乎找不到一个通用的解决方案。

移动Safari：触摸水平滚动的div可以防止垂直滚动

0 个答案: