2015-07-10 66 views
0

enter image description here引導響應確認

HTML作爲您的圖片中看到

<a class="btn" data-toggle="confirmation-popout" data-placement="bottom" data-original-title="" title="">Confirmation on bottom</a>` 

script 

`$('#example').confirmation() 

它不響應。我希望這與響應一起確認按鈕

問題是當我點擊底部按鈕上的確認。有確認彈出。所以當我調整我的窗口時,確認框被修復爲不響應。

請檢查提供的鏈接以測試響應性。

你可以幫我解決這個Link

+2

什麼是你的問題? – greenhoorn

+0

現在你的代碼在哪裏?你只是提供了一個班輪代碼... –

回答

0

你只需要刷新窗口大小調整的確認(「顯示」)。

$(window).resize(function() { 
    $('a + .popover').prev().confirmation('show'); 
}); 

這裏是工作代碼示例。全屏運行代碼片段並調整窗口大小。

$(function() { 
 

 
    $('[data-toggle="confirmation"]').confirmation(); 
 
    
 
    $(window).resize(function() { 
 
    $('a + .popover').prev().confirmation('show'); 
 
    }); 
 

 
});
<link rel="stylesheet" href="http://ethaizone.github.io/Bootstrap-Confirmation/assets/css/bootstrap.css"> 
 

 
<link rel="stylesheet" href="http://ethaizone.github.io/Bootstrap-Confirmation/assets/css/bootstrap-responsive.css"> 
 

 
<link rel="stylesheet" href="http://ethaizone.github.io/Bootstrap-Confirmation/assets/css/docs.css"> 
 

 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script> 
 
<script src="http://ethaizone.github.io/Bootstrap-Confirmation/assets/js/bootstrap-tooltip.js"></script> 
 

 
<script src="http://ethaizone.github.io/Bootstrap-Confirmation/bootstrap-confirmation.js"></script> 
 

 
<div class="container"> 
 

 
    <div class="bs-docs-example tooltip-demo"> 
 
    <ul class="bs-docs-tooltip-examples"> 
 
     <li><a class="btn" data-toggle="confirmation" data-placement="left" data-original-title="" title="">Confirmation on left</a> 
 
     </li> 
 
     <li><a class="btn" data-toggle="confirmation" data-placement="top" data-original-title="" title="">Confirmation on top</a> 
 
     </li> 
 
     <li><a class="btn" data-toggle="confirmation" data-placement="bottom" data-original-title="" title="">Confirmation on bottom</a> 
 
     </li> 
 
     <li><a class="btn" data-toggle="confirmation" data-placement="right" data-original-title="" title="">Confirmation on right</a> 
 
     </li> 
 
    </ul> 
 
    </div> 
 

 
</div>