独立滚动父子div答案

【问题标题】：Independent scroll parent and child div独立滚动父子div
【发布时间】：2017-08-25 17:37:30
【问题描述】：

如下图所示有两个可滚动的 div。

黄色 Div Css：

 #workbench-container #workbench md-content .folder .folder-notes {
    height: auto;
    max-height: 200px;
    overflow: auto;
    width: 100%; 
 }

Parent 滚动条是 ng-scrollable 指令。

<div ng-scrollable="{scrollX:'none',scrollY:'right'}" style="width: 100%; height: 600px;">

能否建议分别滚动两个 div 内容。

我尝试将以下内容添加到控制器中

angular.element(document.querySelector('.mydiv')).bind( 'mousewheel', function ( e ) {
           var event = e.originalEvent;
           var d = event.wheelDelta || -event.detail;
           this.scrollTop += ( d < 0 ? 1 : -1 ) * 30;
           e.preventDefault();
        });

当在子 div（黄色框）中滚动时，父滚动条也一起滚动。只需要滚动鼠标所在的 div。？

【问题讨论】：

标签： javascript css angularjs angularjs-directive

【解决方案1】：

让两个孩子而不是一个孩子。

制作两个子卷轴，基本上可以用相同的css。可以把孩子放在父母的一张桌子上<tr><td><child1></child1></td><td><cdhild2></child2></td></tr>

并将孩子放在你父母的滚动 div 中。

【讨论】：