看板 Web_Design 關於我們 聯絡資訊
※ [本文轉錄自 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的頁面 是怎麼寫的 麻煩版上高手指點迷津... -- ※ 發信站: 批踢踢實業坊(ptt.cc), 來自: 210.242.155.82 ※ 文章網址: https://www.ptt.cc/bbs/Ajax/M.1559208601.A.100.html ※ 編輯: FrankYoshi (210.242.155.82), 05/30/2019 17:31:18
freeccc: Web design 版問問看可能較多人回 05/30 19:07
※ 發信站: 批踢踢實業坊(ptt.cc) ※ 轉錄者: FrankYoshi (210.242.155.82), 05/30/2019 19:22:53
shter: 看不太懂,你是想問 CSS position:fixed 嗎? 05/30 22:27
FrankYoshi: body 用position:fixed 子元素pop就沒有scroll bar了 05/30 23:04
FrankYoshi: 錯了~應該說BODY使用fixed,背景就會跳到最上面 05/30 23:06
FrankYoshi: 不像twitter仍會保留在原來的位子.. 05/30 23:06
shter: 為什麼你的 body 要用 fixed ? 05/30 23:13
shter: 讓 body 與 vw vh 同 size,裡面用一個 div 當 content 05/30 23:17
shter: 這樣 body 不會有 scroll,而主要的 scroll 在 content 05/30 23:17
shter: 再在 body 下用第二個 div 當 pop 然後 position:fixed 05/30 23:18
shter: 當 pop 顯示時把 content 設成 overflow:hidden 05/30 23:18
shter: 這樣 scroll 主導權就只剩下 pop 了 05/30 23:19
foolray: 跟body沒啥關...是對跳出的那個框position fixed或ab啥 05/31 03:21
foolray: 的 就會是那效果了 後面自己再加灰背景 05/31 03:21
FrankYoshi: 已解決~感謝~ 06/04 12:01