脈衝自舉模態背景

是否有一種方法可以「脈動」從50％紅色到100％紅色並回到50％紅色和無限循環的模態背景？脈衝自舉模態背景

<a title="Sobre" data-placement="bottom" data-toggle="modal" href="#Sobre" class="btn btn-primary"> <i class="fa fa-quote-left"></i> </a> 
<div class="modal bs-modal-lg" id="Sobre" tabindex="-1" role="dialog" aria-labelledby="SobreLabel" aria-hidden="true"> 
<div class="modal-dialog modal-lg"> 
<div class="modal-content"> 
<div class="modal-header alert-danger"> 
<h4 class="modal-title" id="myModalLabel"><i class="fa fa-warning"></i>Danger</h4> 
</div> 
<div class="modal-body" style="padding-top: 15px; padding-bottom: 25px;"> 
<h2>Danger!</h2> 
</div> 
<div class="modal-footer"> 
<a class="btn btn-default" data-dismiss="modal">Close</a> 
</div> 
</div> 
</div> 
</div>

引導具有2構建在類：

.modal-backdrop.fade { 
    filter: alpha(opacity=0); 
    opacity: 0; 
} 
.modal-backdrop.in { 
    filter: alpha(opacity=50); 
    opacity: .5; 
}

是否有可能在時間，2秒的量兩者之間交替，例如？

感謝

來源

2016-09-21 Khrys

這個問題可能dublicate [http://stackoverflow.com/questions/6410730/how-to-do-a-webkit-css-endless-rotation-animation](http://stackoverflow。 com/questions/6410730/how-to-do-a-webkit-css-endless-rotation-animation） –

您應該使用css animations。這只是您可以做的一個例子，但您應該玩弄animation屬性擁有的不同子屬性。

.modal-backdrop { 
    background-color: red; 
    animation: warn 2s infinite alternate; 
    -webkit-animation: warn 2s infinite alternate; 
} 

/* Chrome, Safari, Opera */ 
@-webkit-keyframes warn { 
    from {opacity: 0;} 
    to {opacity: 0.5;} 
} 

@keyframes warn { 
    from {opacity: 0;} 
    to {opacity: 0.5;} 
}

有關在不同的瀏覽器支持的詳細信息，請參閱本link通過CSS技巧。這是你的更新jsfiddle

來源

2016-09-21 18:28:51 jtmingus

完美！感謝燈 – Khrys

脈衝自舉模態背景

回答

相關問題