2011-09-23 85 views
2

任何人都可以在Internet Exlorer 7中使用css文件。甘特圖在FF,I8,IE9和Chrome上正常工作,但在IE7中,條形圖不會在網格上方浮動,也不會進入內部滑塊。有沒有人知道這個答案?我嘗試過任何我知道的事情。在IE7中爲jquery ganttView工作css

Browser differences IE7 and IE9

https://github.com/thegrubbsian/jquery.ganttView

+0

這是ganttView中的問題,在IE7 righ關掉盒子,或者當你將它實現到你自己的頁面時發生?我無法測試它,因爲我在Mac上,但它確實在github頁面中說過:「IE7中存在一些小問題」(您在圖像中顯示的問題似乎並不輕微,但我覺得我應該仍然確定它的代碼或修改的問題是否可能)。 – Joonas

+0

這將不僅僅是一個CSS更改。您需要更改JavaScript以使ganttView與IE7標準模式兼容。 – scottheckel

+0

如果你無法使這個控制工作,另一個選擇可能是時間軸控制:http://www.simile-widgets.org/timeline/ – Spudley

回答

2

我解決IE7的問題(肯定不是在所有版本的IE)。只有它在文件(jquery.ganttView.css)neccesary寫:

div.ganttview-hzheader-month, 
div.ganttview-hzheader-day, 
div.ganttview-vtheader, 
div.ganttview-vtheader-item-name, 
div.ganttview-vtheader-series, 
div.ganttview-grid, 
div.ganttview-grid-row-cell { 
    float: left; 
    /* IE problem */ 
    position: relative; 
    top: 0; 
    left: 0; 
} 
... 
div.ganttview-slide-container { 
    overflow: auto; 
    border-left: 1px solid #999; 
    /* IE problem */ 
    position: relative; 
} 
... 
div.ganttview-blocks { 
    margin-top: 40px; 
    /* IE problem */ 
    position: absolute; 
    top: 0; 
    left: 0; 
} 
1

IE7下的問題來源於應用了div元素的inline-block的CSS屬性。 這不起作用,因爲IE7只接受inline-block屬性的內聯元素。

我的解決辦法是:在jquery.fn.gantt.js 1),行82

.append(jQuery('<span class="page-number"/>') 

2取代

.append(jQuery('<div class="page-number"/>') 

),那麼你就必須解決一個小側面佈局 - 效果(向下移動頁碼)通過在CSS文件中添加IE7 hack:

/*hack for IE7*/ 
*+html .fn-gantt .navigate .page-number span { 
    top:-5px !important; 
}