[問題] css position問題

作者: a2975313 (GN)   2014-08-26 23:45:27
我不知道這問題算不算單純的web problem, 因為同時用到html+css+javascript,
如果錯板請原諒Orz
正題: 我用上述3種東西製作web版的combobox, 但遇到一個css position定位的問題,
我用javascript動態組出content的內容後, content style position如果設成
absolute結果會超出最外層的scrollbar div, 如果設成relative那combobox跟
下個元素間又會被content撐開, 有沒有什麼辦法能讓content黏在combobox下面
但又不會超出外層scrollbar div.
怕大家看不懂"超出scrollbar div"的意思, 大概就像使用z-index一樣, 會顯示在最上層
,完全不受上層元素控制.
html大致如下:
<div style="overflow:auto;width:100px;height:200px;">
...
<input type="text" id="combobox" />
...
</div>
javascript產生的combobox內容如下:
<div id="content">
<a>台南市</a>
...
...
<a>台中市</a>
</div>
作者: mmis1000 (秋月戀楓)   2014-08-27 00:18:00
把#content放進最外層的box裡,最外層box設relativeconetnt用absolute,然後用overflow-y:auto?http://jsbin.com/felav/1/edit 類似這樣
作者: TSW (翹班帝國)   2014-08-27 02:39:00
Why自己刻? 你可以用<select>
作者: a2975313 (GN)   2014-08-27 09:02:00
就算用select也會有定位的問題~
作者: TSW (翹班帝國)   2014-08-27 18:42:00
你js產生的div是append到哪邊去?
作者: a2975313 (GN)   2014-08-27 19:39:00
mmis1000的做法是可行的,十分感謝~回TSW:如果設成absolute那append到拿裡其實都沒差主要是top left定位的問題
作者: TSW (翹班帝國)   2014-08-27 20:16:00
又不是FIXED...怎麼會沒差...祖absolute元素會影響你的定位打錯 祖position元素
作者: a2975313 (GN)   2014-08-27 23:53:00
最外層div中包含很多層element,最後才是comobox最後是append在最外層div中,但如果是append在跟combobox同一層的話不知道能不能成功.目前正在調整top left中...
作者: TSW (翹班帝國)   2014-08-28 00:38:00
append在最外層代表你沒有看懂mmis的做法。你可以用一個DIV設relative,把combobox跟menu放在裡面,這樣TOP跟LEFT就很好設。這DIV也可以隨便搬移,選單不會跑掉。
作者: a2975313 (GN)   2014-08-28 01:22:00
我的最外層div就是scrollbar的div,就是append到這div裡

Links booklink

Contact Us: admin [ a t ] ucptt.com