Как сделать края линии затухающими?

Question

Этот бит css будет центрировать 1 пиксель высотой бар в контейнере. Я меняю его ширину, чтобы указать ход какой-то загрузки.

#centered_bar { 
    display: block; 
    margin-left: auto; 
    margin-right: auto; 
    top: 100px; 
    height: 1px; 
    position: relative; 
    background-color: #FFFFFF; 
} 

Как бы я сделать левый и правый край этого элемента «замирания» (так, при увеличении, край будет выглядеть в нижней строке конца в этой картине)?

Answer 1

Это было бы что-то похожее на градиентную заливку и будет зависеть от некоторых проблем совместимости с браузером, так вашей лучшей лучше используют библиотеку JavaScript, как CSS3Pie и анимировать соответствующее свойство с JQuery или что-то подобное.

Я хотел бы начать здесь: http://css3pie.com/documentation/supported-css3-features/#gradients

Удачи!