2016-04-04 30 views
0

Çalıştırmak için Bootstrap 3.3.5 popover'ı alamıyorum. Pop-up-giriş-grup-addon gezinirken görünür hale gelmesini istiyorum, ancak hiçbir şey olmuyor.Modal ve giriş-grubu-addondaki Bootstrap popoveri

Benim geçerli kod:

JavaScript:

$(document).ready(function() { 
     $("[data-toggle=popover]").popover({ trigger: 'hover', container: '#imgPopover'}); 
    }); 

HTML

<div class="input-group"> 
    <button id="imgPopover" type="button" class="input-group-addon" data-toggle="popover" data-placement="bottom" data-content="Content" data-trigger="hover"> 
     <img src="~/images/absolent-logo.gif" style="max-height: 20px" /> 
     <span data-bind="html: $parents[1].text.qTempHeader"></span> 
    </button> 
    <input type="number" class="form-control" data-bind="value: qTemp"/> 
</div> 

farklı şeyler bir demet denedim, ama hiçbir şey yapmak gibi görünüyor. Doğru yönde bir itme çok takdir edilecektir.

+0

Bu $ ('vücudun) deneyin popover ({seçici: [veri geçiş = "popover"]}); – Satya

+0

W3Schools hakkında bir eğitim bulduğum: http://www.w3schools.com/bootstrap/bootstrap_popover.asp sadece biraz aşağı kaydırın ve son örneği görün :) – Jer

cevap

1

Sorun, container: '#imgPopover' özniteliğiyle, div popover içerecek kadar küçük. body'a ve çalışmasına değiştirin. .

$(document).ready(function() { 
 
     $("[data-toggle=popover]").popover({ trigger: 'hover', container: 'body'}); 
 
    });
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<!-- Latest compiled and minified CSS --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"> 
 

 
<!-- Optional theme --> 
 
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap-theme.min.css" integrity="sha384-fLW2N01lMqjakBkx3l/M9EahuwpSfeNvV63J5ezn3uZzapT0u7EYsXMjQV+0En5r" crossorigin="anonymous"> 
 

 
<!-- Latest compiled and minified JavaScript --> 
 
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"></script> 
 

 
<div class="input-group"> 
 
    <button id="imgPopover" type="button" class="input-group-addon" data-toggle="popover" data-placement="bottom" data-content="Content" data-trigger="hover"> 
 
     test me 
 
    </button> 
 
    
 
</div>

+0

Hayır, yapmadınız ... – robbannn

+0

bootstrap css ve js yüklü? – Zamboney

+0

Evet, eminim – robbannn

İlgili konular