作者TonyQ (沉默是金。)
看板Ajax
標題Re: [問題] 我寫了一個google建議選單的功能
時間Thu May 13 03:51:31 2010
※ 引述《wa120 (哇120)》之銘言：
: 舉例: http://www.google.com.tw/
: 就是在輸入文字那邊輸入關鍵字，會有建議關鍵字的功能
: 現在遇到了一個問題..
: 就是那邊必須要用圖層實作(z-index)，google也是這麼做的
: 但是有些電腦瀏覽器會變成透明，也就是後面的文字會跟建議的文字重疊
: 有什麼辦法可以去除透明的問題....
: 我設了background-color:#FFFFFF;沒用
: background-image:url(white.jpg);也沒用
: 請問各位有什麼辦法...
: 如果有需要看我目前做的東西的話在跟我說..
你跟我想的一樣是弄了個DIV 在下面偽裝成類似select的東西嗎？
總之，理論上背景設一個特定顏色應該就可以改善背景透明的問題...
有sample的話當然最好（哪些browser有問題也說一下）
--
What do you want to have ? / What do you have?
從書本中，你可以發現我的各種興趣。
從ＣＤ中，你可以瞭解我所喜歡的偶像明星。
或許從文字你很難以瞭解一個人，但從物品可以。
My PPolis , My past. http://ppolis.tw/user/Tony
--
※ 發信站: 批踢踢實業坊(ptt.cc)
◆ From: 114.136.179.166
1F：推 wa120:沒改善... 05/13 03:54
3F：→ wa120:建議清單那邊.. 有些電腦文字會重疊.. 05/13 03:55
4F：→ wa120:關鍵字 林 or 王 05/13 03:56
5F：→ wa120:只有IE有問題 05/13 03:56
6F：推 No:我只有在火狐用IE tab看會變透明，但用IE8開不會變透明 05/13 04:15
7F：推 wa120:有些電腦IE 8會 我有測過IE 6 也會 05/13 04:16
8F：→ No:話說用火狐開沒反應，有event沒定義的錯誤 05/13 04:16
9F：→ No:event我記得火狐要隨call function的時候當參數順便丟過去處理 05/13 04:17
10F：推 No:我在IE8怎麼開都正常，也沒IE6可測，看來幫不上你了 05/13 04:22
11F：推 wa120:event應該是這行 event.keyCode 我google到的為了測 05/13 04:41
12F：→ wa120:ascii code 05/13 04:41
13F：→ TonyQ:我剛試著把每個li背景上色，很明顯是下方蓋到上面... 05/13 05:16
14F：→ TonyQ:下面東西的層級在上面東西之上...不過改z-index好像沒用 05/13 05:16
15F：→ TonyQ:是說firefox底下會有錯誤是你綁定click時沒把e從fn傳進去 05/13 05:18
16F：→ TonyQ: $("#KeyWord").bind("keyup",function(){ 05/13 05:18
17F：→ TonyQ: ^^^^ e 05/13 05:18
18F：→ TonyQ:event 05/13 05:18
19F：→ TonyQ:在想會不會是position 不一樣的問題，所以z-index亂了... 05/13 05:19
20F：推 wa120:我發現google處理這個是用table 05/13 05:23
21F：推 No:我猜測可能是CSS的.Top的position:relative造成背景透明 05/13 05:24
22F：推 No:我把該position:relative拿掉，#popup的left改500px 05/13 05:26
23F：→ No:再用ie tab開，背景就出來了 囧 真是太謎了 05/13 05:27
24F：→ No:至於解法...這似乎是IE6的bug，因為用currentStyle看 05/13 05:28
25F：→ No:背景圖是還在的 05/13 05:28
26F：→ No:不知道有沒有不改變relative前提下的解法 05/13 05:28
27F：推 wa120:感謝No大 我把position:relative改成margin-top:50px; 05/13 05:54
28F：→ wa120:解決了 可惜我不知道該怎麼留下sample給後面的人看 05/13 05:55
29F：推 wa120:我發現這樣還不太好 我換解析度位置會跑掉.... 05/13 06:07
30F：→ TonyQ:其實我在猜應該要連ul也一起改 , 我從debugbar看來是 05/13 06:08
31F：→ TonyQ:positon:static的狀況，至少把他改成relative 看看 05/13 06:09
32F：→ wa120:google也是用relative+absolute的手法 可是我不知道怎麼辦到 05/13 06:09
33F：→ TonyQ:因為我現在手上沒有能對class 操作的工具..(js太麻煩了= = 05/13 06:09
34F：→ TonyQ:所以我就不當忙測了... 05/13 06:09
35F：→ TonyQ:其實比較大的問題是 absolute+static 或 relative+static 05/13 06:09
36F：→ TonyQ:我前陣子才解過一個這類型的問題...不過我現在沒空幫你測XD 05/13 06:10
38F：→ wa120:沒差 哈哈～ 我只覺得我會卡很久 替代方案就顯示3筆資料= = 05/13 06:11
39F：推 No:我想是 <div:relative><div:absolute>背景不見</div></div> 05/13 06:12
40F：→ No:這樣的相對關係在IE6會讓背景不見 05/13 06:12
41F：→ TonyQ:我確定不是這問題，因為我有對每一個子元素上色，元素確實 05/13 06:13
42F：→ No:改成 <div:relative></div> <div:absolute>背景有</div> 05/13 06:13
43F：→ TonyQ:是對的，只是下方的元素硬是蓋在上面而已。 05/13 06:13
44F：→ TonyQ:而且照你舉的例子來講 absolute是子元素他應該會在上面 05/13 06:14
45F：→ No:把你的popup獨立出來外面就會顯示背景顏色了 05/13 06:14
46F：→ TonyQ:他現在的問題不是背景不見，如果上色會發現其實是有背景的 05/13 06:14
47F：→ TonyQ:只是下面的元素沒有被遮住，反而是下面的元素去遮上面的 05/13 06:15
48F：推 No:的確是像T大講的那樣，事實上是有填色的 05/13 06:28
49F：→ No:把CSS的.Top加上z-index:1~98，就不會透明了 05/13 06:30
50F：→ No:position的推測只是誤打誤撞中了XD 05/13 06:31
51F：推 No:這樣原因大概是整個<div class="Top">層級都比 05/13 06:33
52F：→ No:<div class="database">的層級還低 05/13 06:34
53F：→ No:Top內的標籤設定的z-index被IE6無視這樣 05/13 06:34
54F：→ No: ^^Top之內的HTML標籤似乎準確一點 05/13 06:36
55F：推 wa120:謝謝各位喔.. 把 .Top的z-index:1;就ok了.. 05/13 06:41