作者FrankYoshi (作别人生命中的天使!)
看板Web_Design
标题Fw: [问题] 关於网页overflow:hidden
时间Thu May 30 19:22:53 2019
※ [本文转录自 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://webptt.com/cn.aspx?n=bbs/Ajax/M.1559208601.A.100.html
※ 编辑: FrankYoshi (210.242.155.82), 05/30/2019 17:31:18
1F:→ freeccc: Web design 版问问看可能较多人回 05/30 19:07
※ 发信站: 批踢踢实业坊(ptt.cc)
※ 转录者: FrankYoshi (210.242.155.82), 05/30/2019 19:22:53
2F:推 shter: 看不太懂,你是想问 CSS position:fixed 吗? 05/30 22:27
3F:→ FrankYoshi: body 用position:fixed 子元素pop就没有scroll bar了 05/30 23:04
4F:→ FrankYoshi: 错了~应该说BODY使用fixed,背景就会跳到最上面 05/30 23:06
5F:→ FrankYoshi: 不像twitter仍会保留在原来的位子.. 05/30 23:06
6F:推 shter: 为什麽你的 body 要用 fixed ? 05/30 23:13
7F:推 shter: 让 body 与 vw vh 同 size,里面用一个 div 当 content 05/30 23:17
8F:→ shter: 这样 body 不会有 scroll,而主要的 scroll 在 content 05/30 23:17
9F:→ shter: 再在 body 下用第二个 div 当 pop 然後 position:fixed 05/30 23:18
10F:→ shter: 当 pop 显示时把 content 设成 overflow:hidden 05/30 23:18
11F:→ shter: 这样 scroll 主导权就只剩下 pop 了 05/30 23:19
12F:→ foolray: 跟body没啥关...是对跳出的那个框position fixed或ab啥 05/31 03:21
13F:→ foolray: 的 就会是那效果了 後面自己再加灰背景 05/31 03:21
14F:→ FrankYoshi: 已解决~感谢~ 06/04 12:01