在所有瀏覽器中以javascript的形式返回CSS屬性的確切值

我試圖實現跨瀏覽器的if/else語句。問題是我正在檢查一個元素上的'top'屬性，並且Safari瀏覽器會返回css值，而Opera & Firefox無論如何總是以像素爲單位返回它。有沒有什麼方法可以直接讀取CSS，並使用jQuery或JavaScript在元素中返回'top'的值，因爲它是在.css文件中輸入的？在所有瀏覽器中以javascript的形式返回CSS屬性的確切值

我需要一個以％表示的統一值。問題在於Firefox將其轉換爲像素。

這裏是我的代碼：

if ($('#wrapper').position().top == '-100%') { 
     // Do Stuff 
}

這個工作在鉻鍍鉻以來在實例返回-100％。但火狐返回類似'-720px'。它將該百分比轉換爲像素。

來源

2012-02-22 alt

你能解釋一下你的用例嗎？你爲什麼需要源值？ – casablanca 2012-02-22 04:39:23

由於Firefox返回像素，Chrome/Safari會返回代碼中的任何內容。我只需要兩個瀏覽器的統一回報。不管它是什麼，只要他們給出同樣的事情。 – alt 2012-02-22 04:40:18

我會編輯我的問題... – alt 2012-02-22 04:40:30

據我所知，你不能拿回％，但您可能能夠通過將來自CSS）除以身高（返回像素弄明白。

var top = parseInt($('#ID').css('top'))/$('#ID').parent().height() * 100;

來源

2012-02-22 05:12:56 MikeCruz13

謝謝！這工作完美。很遺憾，您必須提取並轉換像素。 Firefox和Chrome應該都返回相同的值，對吧？ – alt 2012-02-22 05:23:17

很高興它的作品，只能希望，但它應該..：D – MikeCruz13 2012-02-22 05:24:31

您無法獲得CSS文件中輸入的內容，但可以簡單地對返回值進行一些解析。下面應該標準化你的值，然後你可以做任何你需要做的比較（使用JQuery）。

parseInt($("#elementId").css("top").replace("px", ""))

來源

2012-02-22 04:39:56 AlexGad

我不太明白。看看我的問題（剛剛更新）我的代碼，看看這是否仍然有效。 – alt 2012-02-22 04:44:31

可以使用parseInt函數（）方法從CSS屬性返回的數值。

var top = parseInt($("#someElement").css("top"));

來源

2012-02-22 04:44:27

這不會有什麼幫助，因爲100％會被解析爲100，而720px是720.OP要求返回的值使用相同的單位，與瀏覽器無關 – xbonez 2012-02-22 04:51:45

謝謝@xbonez。 – alt 2012-02-22 04:52:30

@JacksonGariety使用的是什麼版本的jQuery？ – 2012-02-22 04:54:58

在所有瀏覽器中以javascript的形式返回CSS屬性的確切值

回答

相關問題