在CSS中傳遞引用？

我想在下面的css代碼段中的進度條 div下傳遞一個引用（右側？），我試圖在隨後的狀態 div中掛鉤％ 800/1000是80％。有沒有辦法做到這一點？謝謝！在CSS中傳遞引用？

<div id="progressbar"> 
    <div id="progress" style="width: 80%;"> </div> 
</div> 
<div id="status"> 
    <span class="heading">MONEY RAISED</span> 
    $ 800 
    <span class="heading">MONEY ASKED</span> 
    $ 1,000 
</div>

來源

2011-04-20 flipflop99

JavaScript是這裏的答案！ – 2011-04-20 13:36:26

這不是CSS，你是什麼意思與「鉤與％美元金額」 – RoToRa 2011-04-20 13:36:58

@RoToRa我認爲他的意思是，讓800美元是80px寬，1000美元一個100px寬（例如） – 2011-04-20 13:38:01

有沒有辦法做到這一點？

不是，不在純CSS中。您必須指定一個類或包含所需像素寬度的style屬性，或使用JavaScript解析出美元值，並相應地設置寬度。

來源

2011-04-20 13:36:40

您可以使用CSS表達式。

CSS表達式是動態設置CSS屬性的一種強大（和危險）方法。表達式的問題在於它們比大多數人期望的更頻繁地進行評估。

http://gadgetopia.com/post/2774
http://msdn.microsoft.com/en-us/library/ms537634(v=vs.85).aspx
http://blog.dynatrace.com/2010/02/16/the-real-performance-overhead-of-css-expressions/

我不認爲這樣做是在CSS中，因爲它使用jQuery/JavaScript的很容易。

如果你可以改變你的DOM，一點點，它會幫助很多。就像這樣：

<div id="progressbar"> 
    <div id="progress"> </div> 
</div> 
<div id="status"> 
    <span class="heading">MONEY RAISED</span> 
    $ <span id="raised">800</span> 
    <span class="heading">MONEY ASKED</span> 
    $ <span id="asked">1000</span> 
</div>

比使用jQuery：

var raised = parseInt($('#raised').text().replace(',','')), 
    asked = parseInt($('#asked').text().replace(',','')); 
$('#progress').css('width', (raised/asked)*100 +"%");

或javascript：

var raised = parseInt(document.getElementById('raised').innerHTML.replace(',','')), 
    asked = parseInt(document.getElementById('asked').innerHTML.replace(',','')); 
document.getElementById('progress').style.width = (raised/asked)*100 +"%";

來源

2011-04-20 15:08:11 rucsi

CSS表達式很有趣，但在IE8標準模式及更高版本中，Internet Explorer 8及更高版本不再支持動態屬性（也稱爲「CSS表達式」）。其餘爲+1，特別是展示jQuery和非jQuery方式 – 2011-04-20 19:04:23

在CSS中傳遞引用？

回答

相關問題