小雕雕的家

今天在用 css position 定位時發現一個問題....

原本在 chrome + firefox 中都可以正確的將元素定位在指定的位置

但在IE只要你捲動視窗他就會跟著跑 @@

ex : 

<img src="images/index_artist-title.png" style="position:absolute;" id="startitle" />

<script language="javascript" type="text/javascript">
     $(document).ready(function(){
          var pos = $("#startitle").position();
          $("#startitle").css("left",eval(pos.left + 2))
     });
</script>

上面這段是我想要定位在它原本位置的位置附近偏右一點點....

然後IE很白痴的是你只要捲動滑鼠滾輪,被定位的那東西就會跟著跑 @@

(就是定位點是視窗的左上角,而不再是文件的左上角)

找不太到原因所以又去拜 google 發現一段致命性的文字

http://doc.housetube.tw/kb/article.php?id=24

但這邊有一個很重要的限制，就是父區塊的position不是設定absolute或relative時，定位就會繼續往上參考，換句話說當設定position為absolute的區塊要做定位時，參考的父區塊原點必須也要有absolute或relative的設定，如果都沒有設定就會參考到視窗的原點，我想這就是「絕對位置」的意思了，因為當你的區塊都沒有設定position的屬性時，你這個區塊就好像是絕對位置的設定。

意思就是當你要定位時,你的父容器也必須要是固定位置或設定 position : absolute,不然的話要定位的區塊會一層一層的往上找位置的參考

如果找不到就會參考視窗的原點,所以我捲動滑鼠他才會跟著動

但很奇怪的是 google chrome + firefox 居然沒這問題 @@

這次還是剛好網頁都是用 div 堆成才遇到的....所以之前用table 排版這樣寫都沒遇到....