Question

我正在使用Iscroll.js进行一个项目，该项目要求所有元素都适合屏幕的高度以及大的水平滚动。我的问题是，某些元素会根据内容的数量垂直溢出。

我用过＆＃34; overflow-y：scroll＆＃34;在这些元素上，它在桌面浏览器上运行良好，但在移动设备上运行不

我尝试过webkit前缀-webkit-overflow-scrolling：touch但是也行不通。

我的垂直滚动元素的css是：

  white-space: nowrap;
  overflow-x: hidden;
  overflow-y: scroll;
  -webkit-overflow-scrolling: touch;

您可以在http://govanhillpeopleshistory.com/dev/

找到该网站

Answer 1

对于任何有兴趣的人我都设法通过恢复到IScrolll =并在我的主滚动条中使用多个嵌套滚动来解决这个问题。使用与this question类似的解决方案。

基本上创建一个数组来保存所有的IScroll对象，迭代你想要滚动的每个元素，获取它的ID，然后使用你抓取的ID创建一个新的数组元素和Iscroll对象。继承我的代码：

          articleBottomState.find('.cards-wrapper').each(function(){ 

            $(this).find('.content-card').each(function(){
              //console.log(counter++);

              var currentCardID = '#' + this.id; //Get Scrollable Areas ID
              console.log(currentCardID);

              //Add another array element to the myscrollers array
              myscrollers[vertScrollCOunter++] = new IScroll(currentCardID, {
                scrollX: true, 
                scrollY: true, 
                mouseWheel: true,
                momentum: false
              });
            });

          });

Icroll.js子元素溢出：滚动不在IOS上工作

1 个答案: