Fw: [問題] 關於網頁overflow:hidden

作者: FrankYoshi (作別人生命中的天使!)   2019-05-30 19:22:53
※ [本文轉錄自 Ajax 看板 #1SxwAP40 ]
作者: FrankYoshi (作別人生命中的天使!) 看板: Ajax
標題: [問題] 關於網頁overflow:hidden
時間: Thu May 30 17:29:59 2019
版上各位朋友好
想請教一個關於overflow屬性的問題
最近想嘗試製作twitter的pop視窗
圖示如下:
https://imgur.com/huVjWM7
點選內容區塊
則背景會鎖定
只剩下前景的內容有scroll bar 可以滑動
不過這邊有一些疑惑
看了一下程式碼,body的地方有overflow:hideen的屬性
我自己試了後
內容的區塊都會繼承父元素的overflow:hidden失效
所以這邊想要問的問題是
像fb網誌或twitter這種鎖定頁面,而讓前景內容可以scroll的頁面
是怎麼寫的
麻煩版上高手指點迷津...
作者: freeccc (自由的ccc)   2018-05-30 19:07:00
Web design 版問問看可能較多人回
作者: shter (飛梭之影)   2019-05-30 22:27:00
看不太懂,你是想問 CSS position:fixed 嗎?
作者: FrankYoshi (作別人生命中的天使!)   2019-05-30 23:04:00
body 用position:fixed 子元素pop就沒有scroll bar了錯了~應該說BODY使用fixed,背景就會跳到最上面不像twitter仍會保留在原來的位子..
作者: shter (飛梭之影)   2019-05-30 23:13:00
為什麼你的 body 要用 fixed ?讓 body 與 vw vh 同 size,裡面用一個 div 當 content這樣 body 不會有 scroll,而主要的 scroll 在 content再在 body 下用第二個 div 當 pop 然後 position:fixed當 pop 顯示時把 content 設成 overflow:hidden這樣 scroll 主導權就只剩下 pop 了
作者: foolray (foolray)   2019-05-31 03:21:00
跟body沒啥關...是對跳出的那個框position fixed或ab啥的 就會是那效果了 後面自己再加灰背景
作者: FrankYoshi (作別人生命中的天使!)   2019-06-04 12:01:00
已解決~感謝~

Links booklink

Contact Us: admin [ a t ] ucptt.com