應用漸變與納克風格角度JS

無法設置採用了棱角分明的js NG風格指令的梯度..能夠通過使用下面應用漸變與納克風格角度JS

<span ng-style="{'background-color': slidercolor}">works</span>

但對於梯度設置正常的顏色它不工作

下面是jsfiddle相同。

<span ng-style="{'background-color':'-webkit-gradient(linear, left top, right top, color- stop(0%,'slidercolor'), color-stop(100%,rgba(125,185,232,0)))'}">didnt work</span>

http://jsfiddle.net/sT8ar/1/

也請讓我知道應該用引號括起來，那些不應該..

來源

2013-09-21 anandaravindan

您使用的是什麼瀏覽器？ – box86rowh

這一個應該在ie10上工作：http://jsfiddle.net/sT8ar/2/ – box86rowh

問題是大多數瀏覽器需要不同的代碼來顯示漸變，你擁有的僅僅是用於webkit瀏覽器，比如chrome和safari。 – box86rowh

你來到這裏兩個問題：

-webkit-gradient()產生<image>，不<color>，它應該用作background-image。
在Angular表達式連接中使用+（加號）完成。

所以正確的語法是（demo）：

<span ng-style="{'background-image':'-webkit-gradient(linear, left top, right top, color-stop(0%,'+ slidercolor+'), color-stop(100%,rgba(125,185,232,0)))'}"> 
    Works now too. 
</span>

來源

2013-09-21 20:02:37 Pavlo

應用漸變與納克風格角度JS

回答

相關問題