我正在設計一個頁面angular-material,我想在屏幕右下角添加一個聊天按鈕,當我向下滾動頁面時,這個按鈕應該滾動,就像這個網站一樣:http ://harleytherapy.com/我已經完成了大部分部分,即按鈕位于右下角,當我開始滾動頁面時,它也會隨頁面滾動,但唯一的問題是,當我到達底部時,該按鈕位于頁腳后面并變得不可見。當我到達底部時,我希望它保持在頁腳上方。這是我的代碼:<div class="main-content-container"> <button mat-fab class="chat-icon-btn"> <mat-icon class="chat-icon">chat_bubble_outline</mat-icon> </button> <h1>Dashboard <mat-icon aria-label="false">dashboard</mat-icon> </h1> <!-- Some more content --> <footer class="footer"> <span> <a href="#" class="footer-links">Hjem</a><span class="vertical-divider"></span> <a href="#" class="footer-links">Om </a> <span class="vertical-divider"></span> <a href="#" class="footer-links"> Hj?lp </a> <span class="vertical-divider"></span> <a href="#" class="footer-links"> Kontakt os </a> <span class="vertical-divider"></span> <a href="#" class="footer-links"> Webstedsbetingelser </a> <span class="vertical-divider"></span> <a href="#" class="footer-links"> Fortrolighedspolitik</a> </span> </footer></div>CSS:.main-content-container { margin-left: 10%;}.chat-icon-btn { position: fixed; right: 0; bottom: 0; background: #3900B3; color: #fff; font-size: 25px; margin-right: 25px; margin-bottom: 5px;}.chat-icon { margin-right: 0px !important;}.footer { background-color: #3900B3; padding: 50px 0 50px 0; position: relative; text-align: center; margin-top: 100px;}.footer-links { color: #fff; text-decoration: navajowhite; font-size: 18px;}提前致謝。
- 1 回答
- 0 關注
- 149 瀏覽
添加回答
舉報
0/150
提交
取消