角度材料md工具栏不粘(md-scroll-shrink)

时间:2016-03-23 20:50:56

标签: javascript html angularjs angular-material

我在我的网页上使用了<md-subheader md-scroll-shrink>,但是当用户向下滚动时(例如在scroll shrink demo中),它并没有坚持到顶部。

有什么想法吗?也许我的布局导致了问题?

<body>
  <div>
    <md-toolbar md-scroll-shrink>
    <div>
      <md-sidenav>
      <md-content>
        <section>
          <md-subheader>
...

这是codepen

2 个答案:

答案 0 :(得分:4)

是的,您的布局存在问题。我做了一点重组。见http://codepen.io/anon/pen/VabdzW

<div ng-app="MyApp" layout="column" ng-controller="MainCtrl as main" ng-cloak layout-fill>
  <md-content flex layout="column">
    <md-toolbar flex="50">
            ...
    </md-toolbar>

    <div layout="row">
        <md-sidenav layout="column" class="md-sidenav-left" md-component-id="left" md-is-locked-open="$mdMedia('gt-sm')" layout-padding md-whiteframe="4">
            ..
        </md-sidenav>
        <md-content layout="column" layout-padding flex>
            ..real content
        </md-content>
      </div>
    </md-content>
</div>

答案 1 :(得分:0)

检查此example

O(SizeOf(s) * SizeOf(t) * Time to look Up or insert in Dictionary)