角度md-fab-toolbar跟隨滾動

我有一張帶有3張卡片的頁面，其中一張有一個md-fab-toolbar。角度md-fab-toolbar跟隨滾動

<md-card class="card-width"> 
      <md-toolbar class="md-hue-2" layout-align="center start" layout-padding> 
      <span>{{cardName}}</span> 
      </md-toolbar> 
      <md-card-content> 
      <div> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
         <p>Scroll</p> 
        </div> 
        <md-fab-toolbar md-direction="left" class="md-fab-bottom-right"> 
         <md-fab-trigger class="align-with-text"> 
          <md-button aria-label="menu" class="md-fab md-primary"> 
           <md-icon>menu</md-icon> 
          </md-button> 
         </md-fab-trigger> 
         <md-toolbar> 
          <md-fab-actions class="md-toolbar-tools"> 
           <md-button aria-label="comment" class="md-icon-button"> 
            <md-icon>magnify</md-icon> 
           </md-button> 
           <md-button aria-label="comment" class="md-icon-button"> 
            <md-icon>magnify</md-icon> 
           </md-button> 
           <md-button aria-label="comment" class="md-icon-button"> 
            <md-icon>magnify</md-icon> 
           </md-button> 
           <md-button aria-label="comment" class="md-icon-button"> 
            <md-icon>magnify</md-icon> 
           </md-button> 
           <md-button aria-label="comment" class="md-icon-button"> 
            <md-icon>magnify</md-icon> 
           </md-button> 
          </md-fab-actions> 
         </md-toolbar> 
        </md-fab-toolbar> 
      </md-card-content> 
     </md-card>

入住此codepen： http://codepen.io/marcusdacoregio/pen/ZpdQwa

我想要的MD-FAB-工具欄跟隨滾動，而不是停留絕對位置。我無法得到這種行爲，你們能幫助我嗎？

來源

2016-10-29 Marcus Dacorréggio

這是你想要的嗎？ - CodePen

標記（相關）

<md-content layout="column"> 
    <md-card class="card-width"> 
     <md-toolbar class="md-hue-2" layout-align="center start" layout-padding> 
      <span>{{cardName}}</span> 
     </md-toolbar> 
     <md-card-content layout="column"> 
      <div id="myList">

CSS

#myList { 
    overflow: auto; 
}

來源

2016-10-31 09:45:49

嘿，謝謝你的回答。幾乎這個，我想要這樣的[codepen]（http://codepen.io/mckenzielong/pen/WvNQox）。無論我的卷軸是什麼，我都希望右下角的晶圓廠按鈕。 –

@MarcusDacorréggio查看已更新的CodePen並回答。 –

非常感謝。這是我一直在尋找的行爲。 –

角度md-fab-toolbar跟隨滾動

回答

相關問題