獲取元素的CSS寬度並將其轉換爲百分比

Question

我有這樣的代碼：

HTML

<div class="bar-value"></div> 

CSS

.bar-value{ 
    width: 50%; 
    height: 28px; 
    background: #8BBDE8; 
} 

JQUERY

$(document).ready(function(){ 
    var percent = $('.bar-value').css('width'); 
}); 

問題這返回t的寬度他在像素div（在這種情況下：200px）。我想要以百分比（50％）返回div的值。

在此先感謝！

Answer 1

要得到一個百分比，你需要它的父母的寬度。試試這個：

$(document).ready(function(){ 
    var element = $('.bar-value'); 
    var percent = element.css('width')/element.parent().width()*100+'%'; 
}); 

Answer 2

這個問題已經回答了here

你必須自己實現：

var width = $('.bar-value').css('width'); 
var parentWidth = $('.bar-value').offsetParent().css('width'); 
var percent = 100*width/parentWidth;